Pipe Chars in HTML Classes

Question

I couldn't find anything in the W3C docs that said pipe chars, |, aren't allowed, for instance:

<div class="class1|class2">

Don't worry about what I might be using it for. I was just wondering if it's "legal".

Answer 1

The relevant rules can be found in w3c syndata tokenization section, though it's pretty difficult to conclude from there if pipe is valid or not, as per a glance, it seems that anything is valid for a selector, i.e.:

selector    : any+;
any         : [ IDENT | NUMBER | PERCENTAGE | DIMENSION | STRING
              | DELIM | URI | HASH | UNICODE-RANGE | INCLUDES
              | DASHMATCH | ':' | FUNCTION S* any* ')' 
              | '(' S* any* ')' | '[' S* any* ']' ] S*;

Answer 2

It's legal HTML, since the datatype of class is CDATA. You will have a problem with CSS selectors, because the pipe is not a valid character for a selector.

Answer 3

It is a valid character in a class name. In fact, I see a website using pipe ( | ) just for the sake of class separation. Which I think is a good practice for readability.