CSS :before superscript “6”? [duplicate]

Question

This question already has an answer here:

• Superscript in CSS only? 14 answers

Is there a way to add a superscript "6" into the "content" CSS property for a pseudo element? I've been all over the web, trying different Unicode strings and glyph codes to try to get this to work, but haven't found a solution.

Thanks!

EDIT: Sorry for not clarifying... I'm needing to put the superscript "6" amongst other text in the same "content" property. Looks like I'll need to just define a different encoding for my CSS and drop it in as a literal character.

Answer 1

There is another solution, as in this fiddle

element:before{
    content:'6'; 
    vertical-align: super; /* make superscript */
    font-size:8px;
}

Answer 2

The obvious way does work, in fact:

span:before {
    content: "⁶";
}

You may have to be careful with encodings used and specified in this case, though.

As BoltClock mentions, you can also escape the character as \2076 if encoding problems are a concern (e.g. if your server forces legacy codepages and you cannot change that).

Answer 3

element:before {
    content: "6";
    font-size: 0.5em;
    vertical-align: top;
}