How to achieve spacing betwn numbered format and content

[vinaybk]

Hello,

I am relatively new to Flare, and am trying to edit the stylesheet we use. The problem I am facing is with the numbered lists (first and second level); more so, with the second level list that uses roman numbers.
Two questions:
1. How can I control the spacing between the number format and the content?
For example: vi. The Application Server is configured for all Talisma Web Components after the following Registry Key is updated...

This is a problem because as the procedure steps keep increasing, the text indents go off (see below):
i. abc
ii. abc
iii. abc
iv. abc
v. abc

How can I control this?

2. Is there a way to control the way these roman numbers are indented? We see in Word that the roman numbers are indented inwards (towards the left margin), and not towards the text.
Please help!

[ChoccieMuffin]

Sorry to say, I don't think you can in Flare. That's because HTML doesn't recognise a tab, and that's what Word uses.

Personally I just live with it (and I don't have lower Roman alpha in my lists so it's easier to do!) but I think you might be stuffed, certainly if you want to use standard lists. I suspect others might come up with a whizzy workaround using paragraph styles but if you've already got a lot of material in Flare it might be too painful to convert.

[NorthEast]

I'd guess that your list (ol tag) has the list-style-position property set to inside - if you set this to outside (which is default), then the text of your list items will be properly aligned.

Using 'outside' means the list number is placed on the left 'outside' of the list item - rather than inside the list item (li) tag itself (which would cause the text to indent).

This should explain it:
http://www.w3schools.com/cssref/pr_list ... sition.asp

Note that when using 'outside', you can't adjust the exact position or alignment of the list numbers (there's no CSS property to do this).

[Psider]

If you want more space between the numbers and the list text, I think you can actually do it by setting padding-left on the li tag. Depending on whether you want it for all lists or only certain types, you may need to use descendants.

e.g.

/* sets padding on all list items */
li { padding-left: 60px;}


/* sets padding only on list items in ordered lists with the class "SubNumbered" */
ol.SubNumbered li { padding-left: 60px; }