TIPS - CSS: Professional Techniques for Modern Layout - page 93

Figure 3-17: Changing marker colors.

In this specii c case, we could've switched the div to a span with no real change of result.
Had we wanted to throw in some borders or a background, then there could be a huge
dif erence between the two. (Granted, you could overcome the dif erence using display .)

95

You'd think that CSS would have ways to independently style the list markers without having
to drop extra elements into the markup—and in fact, you'd be right. h e problem is that
browsers never implemented them, so they're kind of irrelevant.

BACKGROUND BULLETS
So you want to set customized image list markers, but you aren't content with just letting the
browser put it wherever it feels like. h at's okay: Just turn of the list's markers and drop your
image into the list items' backgrounds (see Figure 3-18).

ul.stars { list-style : none ;}
ul.stars li { background : url(star.gif) 0 0.1em no-repeat ;
padding-left : 16px ;}