Geek Answers Handbook

Can I safely use Unicode characters (e.g. accents) in CSS class names or identifiers?

I just came across a situation where product names are automatically inserted into my HTML as class names, and one of these product names has an accented letter. It looks like this:

<div class="español">Hola</div>

If I add a CSS declaration with this class, for example:

 .español {background:yellow;}

Will this cause problems? This seems to work so far, but I'm not sure if it is fully cross-browser compatible.

Also, would it be different if it were an identifier instead of a class? Until now, this also works, but again I’m not sure that it will stay everywhere.

+8
css
source share
2 answers

Apparently, yes. In fact, HTML 4.01 already allowed you to use Unicode characters in the class attribute. HTML 5 now also allows you to use the id attribute. The great thing is that it has been tested with IE 6 and works too, so it is backward compatible.

Now that you have to ask yourself, do I really need them? In my opinion, it just asks about problems, because although W3 accepts them, some not large browsers may not support them (think of browsers for visually impaired or others).

Read this for more information on this: http://mathiasbynens.be/notes/html5-id-class .

+6
source share

From the CSS spec :

"In CSS, identifiers (including element names, classes, and identifiers in selectors) may contain only the characters [a-zA-Z0-9] and ISO 10646 characters U + 00A0 and above, plus a hyphen (-) and an underscore (_)"

The ISO 10646 standard and the Unicode standard synchronized their character sets ( ref ), so in this aspect they are the same.

Symbol-symbol has the code U + 00F1 , therefore it is safe for use in the identifier.

+10
source share

More articles:


All Articles