Insert special character using :before pseudo class in css

html css encoding special-characters pseudo-class

jeroen · Nov 10, 2010 · Viewed 59.2k times · Source

I was toying around with the :before pseudo class in css, trying to insert a special character but the result is not what I was hoping for.

Using:

.read_more:before {
    content: "»";
    margin-right: 6px;
}

I get the character I want, but with an Â character before it and using:

.read_more:before {
    content: "&raquo;";
    margin-right: 6px;
}

I get the complete » on the html page.

I can think of a couple of ways to solve my problem, but I was wondering what the correct syntax would be if I wanted to use the :before pseudo class.

By the way, my doctype is:

<!doctype html>
<html lang="en">

Answer

try this

.read_more:before {
    content: "\00BB";
    margin-right: 6px;
}

\00BB is the unicode representation of that character. It should reasonably works =)

Insert special character using :before pseudo class in css

Answer

Related questions