Nested List Numbering

[JMD]

I tried making an outline-style list using nested UL's with generated
content ":before" similar to what is shown in the CSS specification.

However, a side-effect is that you must change the LI's to
display:block, and the numbering is inside the block, not hanging
left. To work around that, I used the normal code for hanging indent
(margin with the negative amount in text-indent) and that somehow
jumps in much farther than specified in Firefox (not checked in
another browser). What's going on?

But, even with that, I would not get the numbers to line up before the
main block, like with a normal list item. The hanging indent would
need to be a pre-determined amount and not reflect the actual size of
the numbering.

Can CSS 2.1 do this properly?

--John

 

[Nik Coughlin]

I tried making an outline-style list using nested UL's with generated
content ":before" similar to what is shown in the CSS specification.

However, a side-effect is that you must change the LI's to
display:block, and the numbering is inside the block, not hanging
left. To work around that, I used the normal code for hanging indent
(margin with the negative amount in text-indent) and that somehow
jumps in much farther than specified in Firefox (not checked in
another browser). What's going on?

But, even with that, I would not get the numbers to line up before the
main block, like with a normal list item. The hanging indent would
need to be a pre-determined amount and not reflect the actual size of
the numbering.

Can CSS 2.1 do this properly?

I don't know, but generated content won't work in IE