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

This question already has answers here: Adding HTML entities using CSS content (10 answers) Closed 9 years ago.

I would like to use HTML entities in CSS, but it shows me the • instead.

.down:before{
    content:"&bul开发者_C百科l; ";
    color:#f00;
}

Also, why does the above code not work in IE? it does not show the before part at all.

---

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

---

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;
}

---

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.

---

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)