Can you use HTML entities in the CSS “content” property? [duplicate]

Answer 1

You need to escape your entities:

.down:before{
    content:"\• ";
    color:#f00;
}

You cannot see it on IE because IE doesn't support :before (not :after)

Answer 2

Assuming that you want the user to see the • you can simply escape that sequence, to give:

.down:before{
    content:"\• ";
    color:#f00;
}

As to why it's not visible on IE7, that's because IE doesn't support generated content or the :before selector.

Edited to offer that, to see the actual bullet character, you should use:

.down:before{
    content:"\2022";
    color:#f00;
}

JS Fiddle demo.

Answer 3

put hex value of your bullet specail character like this

div:before{
    content:"\2022";
    color:#f00;
}

check this fiddle http://jsfiddle.net/sandeep/HPrkU/1/

NOTE: after & before work in IE8

Answer 4

I'm guessing you want the actual • character displayed, if so simply use the • character instead of •.

Example: http://jsfiddle.net/rmjt8/

Edit: I found another thread: How can I include a HTML-encoded "content:" character in CSS?

Perhaps this will validate:

.down:before{
    content:"\2022 ";
    color:#f00;
}