Special Character Bullets

[vexhawk]

Whats the best way to use a special character as a bullet for lists in CSS.

I'm trying to use "»"?

[stymiee]

li{
    content: "\00BB \0020";
}

Won't work in IE though. If you want it to be cross-browser use an image instead.

[vexhawk]

thanks. i tried doing that to an inline "li" didn't seem to work.

[vexhawk]

Hmm, how would it work in inline tags?

I have this:

<li style="content: '\00BB \0020';">

it doesn't seem to work.

[tracyselena]

an earlier post mentions that for IE to use an image...what would the syntax be for that?

[autocrat]

Two methods I can think of.
You have the image property for Lists, and you have the background-image proprerty also.

li
{
list-style-image: url(yourimage.ext);
}

Or

li
{
list-style: none;
background-image : url(yourimage.ext);
}

Note, with the background-image method, you may need to apply a bit of padding to the list.

[KingRosales]

Hmm, how would it work in inline tags?

I have this:

<li style="content: '\00BB \0020';">

it doesn't seem to work.

Hi vexhawk, try this:

ul li:before { content: "\00BB \0020"; }

It works for me

[Zero13]

The pseudo selector can't support in IE 6 and older. Using the background image must be more flexible and comfortable. I never used the pseudo selector for styling the elements.