Clicky

Glad amatör söker CSS-virtuos för trivsamma pratstunder och promenader i vid havet

Jag försöker finna ett sätt att med hjälp av CSS påverka utseendet av numrerade listor lite mer fritt än vad som traditionellt verkar vara möjligt. I normalfallet har man makt över det format elementen numreras med (decimal, romerska siffror, bokstäver), samt marginaler och ”padding”. Jag skulle vilja ha möjlighet att formge markören (siffran eller bokstaven) separat från själva textinnehållet i <li>-elementet.

När jag satt och kollade på CCS2-specificationenW3Cs hemsidan stötte jag på ett sätt som verkade synnerligen attraktivt. Genom att använda pseudoklassen :before skulle man kunna skapa egna liststilar genom ”markers” och ”counters”. Exempelvis skulle då…

li:before {
display: marker;
content: counter(mycounter, lower-roman) ".";
counter-increment: mycounter;
}

…ge följande lista:

i. This is the first item.
ii. This is the second item.
iii. This is the third item.

Naturligtvis verkar inte detta fungera i någon annan webbläsare än Opera. Är det någon som mot förmodan vet något annat sätt att påverka listors utseende i lite större utsträckning. Är javascript lösningen?

—Nov 09, 2005