Dot lists

Here you can create additional dot lists types. The different formats on the dot lists are created by using different CSS-formats. These formats can contain custom images if desired. There is also a numbered list to choose by default.

Click the plus sign to add a new dot list type. In Custom style you type CSS attributes to generate the appearance for the new dot list.

General

Name

Here you fill in a descriptive name in the field for Name. In the example above Numbered.

Description

Here you add a description (optional).

Numbered

Check this box of you would like a numbered list. Then you will have the common numbered list. If you for example would like roman numbers in the numbered list you can combine the numbered list with Custom style (OL/UL). See example below.

CSS

Custom style (OL/UL

)

Here you can fill in css-attributes for the appearance of the list.
If you for instance would like an image as dot list you type:

list-style-image:url('/images/18.114ef621022023501d80003093/dubbelpil.gif');

Observe! To retrieve the id for an image: Go to the image archive -> right click on the desired image -> choose properties.

Observe! It can be a good idea to specify a list-style-type in case the image is not available for some reason.

list-style-image:url('/images/18.114ef621022023501d80003093/dubbelpil.gif'); list-style-type: square;

If you would like to have a list with squares instead of circles you type:

list-style-type: square;

If you would like a numbered list but with other numbers than the our common for instance roman number you first check the box Numbered and then you type:

list-style-type: upper-roman;

C

ustom

style (LI)

Here you can fill in css attributes for how the alternatives should appear, for instance distance upwards or downwards.

Observe! When you have changed the ordinary dot list style for another dot list you can not return to the common dot list. Therefor it is a good idea to also add the ordinary dot list type.

The dot lists you add does not function like the common dot list with automatic indentation but has indentation as default setting. You can choose to remove the indentation by setting a margin on the list.

A tip!
If you do not want an indentation to the left you type in Custom style (LI):

margin-left:-20px;

If you would like a larger space between the dots you type in Custom style (LI):

margin-bottom:5px; (byt ut 5px mot det avstånd du vill ha).

CSS-attributes for lists

The most common types of non numbered lists:

list-style-type: disc
list-style-type: circle
list-style-type: square
list-style-type: none - no dot, only indentation

The most common types of numbered lists:

list-style-type: decimal - ordinary numbering
list-style-type: lower-roman - roman chars lower-case
list-style-type: upper-roman - roman chars upper-case
list-style-type: lower-alpha - alphabetical numbering lower-case
list-style-type: upper-alpha - alphabetical numbering upper-case

Custom images:

list-style-image:url('address to image');

Permission rights! This portlet/function requires the right Site properties.

Appearance

help-cluster-2.sitevision.net