Browse by Section

Bright Pixels Monogram

CSS Lists, Markers, And Counters 

Rachel Andrew writing for Smashing Magazine:

The ::marker pseudo-element allows you to target the list marker — separately from the content of the list item. This was not possible in previous versions of CSS, therefore, if you changed the color or font size of the ul or li, this would also change the color and font size of the markers. In order to do something as seemingly simple as having different color list bullets than text, would involve either wrapping the content of the list item in a span (or using an image for the marker).

Can I get a finally? It’s simple stuff like this that makes me empathize with people who complain about CSS. This is a perfect candidate for progressive enhancement, where it’ll fallback pretty gracefully on browsers that don’t support ::marker yet.

(via Piccalilli by Andy Bell)