Question

I assume the answer is “no,” but I thought I’d throw the question out there to all you CSS ninjas, since it has cropped up before, and when you’re digging through code that involves a whole team, the happiest answer isn’t always “well, just rework the code.”

Given an ordered list:

<ol>
    <li>...</li>
    <li>...</li>
    <li>...</li>
</ol>

Is it possible to remove the decimal points but retain numbering via JUST CSS, no javascript hackery, etc.? My gut and experience says “absolutely not,” but I know there are some pretty creative types out there, and I wonder if there’s something I haven’t considered yet.

Update

Possible text example, as requested:

Convert ordered list that looks like this:

1. [...content...]
2. [...content...]
3. [...content...]

To something like this:

1 [...content...]
2 [...content...]
3 [...content...]

All with CSS wizardy, no javascript. Again, I realize this might be impossible, but ya just never know, do ya.

Answer 1

This works in Firefox 3.6.6 and Chrome 6, but not in IE7 or IE8 (no suprise there).

OL { counter-reset: item }
LI { display: block }
LI:before { content: counter(item) " "; counter-increment: item }

See http://www.w3.org/TR/CSS2/generate.html#scope