Menu
I just encountered a situation where product names are automatically pulled in to my HTML as class names, and one of those product names has an accented letter. It looks like this:
<div class="español">Hola</div>
If I add a CSS declaration with that class, like this:
.español {background:yellow;}
Will it cause any problems? It seems to work so far, but I'm not sure if it's completely cross-browser compatible.
Also, would it be any different if that were an id instead of a class? That seems to work so far, too, but again I am not sure if it'll hold up everywhere.
269
In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit.
To add a Unicode character to the CSS content property, you can do either of the following: Add a Unicode character directly, or; Use the Character's Hexadecimal Unicode Code Point Value.
To select elements with a specific class, write a period (.) character, followed by the name of the class. You can also specify that only specific HTML elements should be affected by a class.
Yes, you can use same name for both id and class because both parameters have their own significance.
From the CSS specification:
"In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_)"
The ISO 10646 standard and Unicode standard have synchronised their character sets (ref), so in this aspect they are the same.
The ñ character has the character code U+00F1, so that is safe to use in an identifier.
156
Apparently yes. In fact, HTML 4.01 already allowed you to use Unicode characters in the class attribute. Now HTML 5 allows them also on the id attribute. The cool thing is that it's been tested with IE 6 and works too, so it's backwards compatible.
Now what you should ask yourself is, do I really need them? In my eyes is just asking for trouble because while the W3 accepts them, some not-major browser might not support them (think browsers for the visually impaired or others).
Read this for more info on the subject: http://mathiasbynens.be/notes/html5-id-class.
43
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
