I am doing a website and I have a list that I am coding. I know how to do a list and have it highlight when I hover over it, but I want something a little different. I have a numbered list, and I want it to highlight just the number with a transparent circle. I attached a pic of it to get a better idea.
Got a tip for us?
Let us know
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.
CSS List Help; is this even possible?
- Thread starter jdl8422
- Start date
- Sort by reaction score
could you give each <li> a specific id, then under the a:hover state rule, change the list-style-image to a gif of the number with circle highlight? It doesn't need to be transparent.
Similar to the above post, you could have the circle image without a number in it and use it as a background image for the li tag during a hover (a:hover). This would allow the numbering of the ol to be present on top. The only trouble might be to get it to align properly, and wouldn't necessarily stay where it needs to if the user resizes the text. You at least would only have to create one graphic though.