Style an ordered list so the number appears left-aligned and above the item?

You can use the content property with the :before pseudo-element and the a newline escape.

You can use the content property with the :before pseudo-element and the \a newline escape: OL Test Item one Item two Item three That should work fine on browsers that support CSS 2.1.

Thanks for all the incredibly prompt and useful responses, I opted for this solution as it allowed the list item to be clean of anything but the intended content. It works perfectly for me in Chrome/Firefox. Alas, haven't tested IE yet.(will report back when I do) – waffl Oct 18 '10 at 9:21.

AFAIK, CSS does not allow you to have a lot of control regarding the position of the list-item relative to the "bullet" (or number or whatever)... So it might be a better idea to generate the numbers directly in the HTML, on server-side, or on client-side via Javascript... Nevertheless, the following works (at least in Firefox), but is rather ugly (with that br in the middle :-/ ) item 1 item 2 The idea is to force the content of the list-item to be on another line with a br, and then, on the content, apply some negative margins to move it where you want to... This is certainly not a nice solution ... in addition, I think that each browser may generate the "list-index" in its way, so there would be no nice way to have it work on all browsers ...

You can try along the line of: foobar wah la It works on FF and Chrome, but I don't have IE on my current machine to try.

If you are dynamicaly generating the content, then you could always output the numbers yourself, and then format the markup however you like - rather than trying to coerce the browser by doing something 'clever', simplify the situation by doing someting 'smart.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions