HTML class attribute with spaces, it is a W3C valid class?

Question

About HTML class attribute, that assigns CSS class (or classes?) to a tag. The use of spaces, like in

<tag class="a b">....</tag>

is valid?

This syntax is used by some web-designers and occurs into exported HTML of Adobe InDesign (tested with versions 5 and 6), and another HTML generation softwares...

It (class="a b") is a valid W3C syntax? What versions of CSS and HTML? (starting from which version became valid?)

---

EDIT: a natural subquestion "W3C say how to interpret it?" (it is an "override" or another renderization behaviour?) was posted here.

Answer 1

these are two different classes a & b separated by space. see w3c DOCS

class = cdata-list [CS]

this attribute assigns a class name or set of class names to an element. Any number of elements may be assigned the same class name or names. Multiple class names must be separated by white space characters.

---

If you have two class

.a { font-weight: bold; }
.b { font-weight: normal; }

and assign in class="a b" or class="b a", then later class will overwrite the prior class having same property, so font weight will be normal.

If you change the CSS definition order,

.b { font-weight: normal; }
.a { font-weight: bold; }

now the later class is bold, so "overwrite the prior class having same property" results font weight bold.

Answer 2

This is supported in IE 7 and up, including all modern, non-IE browsers. As other commenters have pointed out, it is actually a list of classes, not a single class with spaces.

A better way to understand this is to give your example a few more options:

<tag class="a b">....</tag>
<tag class="a">....</tag>
<tag class="b">....</tag>

.a.b {} in your css will target the first tag.
.a {} will target the first and second tags.
.b {} will target the first and third tags.

This is why using multiple classes on a single element can be very helpful.

For questions of CSS selectors and pseudo selectors, I like to use this (slightly outdated) table http://kimblim.dk/css-tests/selectors/