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.
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
For a low-tech but highly cross-browser compatible solution, you can use a background image with vertically stacked numbers applied to the ol
; just specify a line-height
to be sure it all aligns.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With