How to add html special character (right-arrow) using content property of css?

css, html

Solution

Special characters work a little bit different with pseudo-elements. You can't use HTML entities in CSS, but you can use Unicode hex escapes. Here is a tool to convert the numeric value of the special character to the CSS value.

http://www.evotech.net/articles/testjsentities.html

for example `&#9658` needs to be `\25BA`

working example:

http://jsfiddle.net/L6suy/

.right-arrow:after {
  content: '\25BA \25BC \25C0 \25B2'
}
<div class="right-arrow"></div>

Problem

I am trying to add html special character using its code. Its working fine when I use it inside my div but how can I do this using css. I have tried as following. ``` .right-arrow:after { content:'&#9658' } ``` DEMO EDIT What I wanted is not there in Matt Ball's answer because I wanted code for right arrow and in that question there is code for down arrow only. So its not duplicate.

Original source

Related problems