Multiple classes for a single element?

Why have I not come across this before?
Are there support problems, display inconsistencies, or some other issues?
I was just dissecting Stu Nicholls' ProDroplineDropdown CSS Menu, and came across his use of 2 classes (seperated by a space) for certain elements.

This was definitely a HOLY COW! moment, especially since I was just wishing for this yesterday.

Are there any reasons to NOT do this?
What is the limit on how many classes you can assign to a single element (for curiosity sake)?

~ Mo

You read it just right. You can have as many classes as you want, which makes .class more flexible than #id. You can only have 1 id per element, however. I'm not saying, though, id is bad to use. You should use classes and ids for certain uses.

... You can only have 1 id per element...
My understanding was that you are also limited to 1 instance of any ID for an entire page. Am I at least accurate with that?

~ Mo

Yes, IDs are allowed once per page. Classes are reusable, so multiple elements can have the same class, and elements can have multiple classes.

I seem to remember older versions of IE having issues with:

.class1.class2.class3.blablabla {
/* properties */
}


But that is the only issue that can crop up with multiple classes (that is, selecting elements specifically having multiple classes).

Now I've got a cool new tool :D

~ Mo

Using multiple CSS classes on a HTML element is fine. You can't have more than one ID per page. But when you implement CSS class chaining you have to think to yourself - is what I am doing worth this much effort? Or could I simply use an ID instead and bundle all of the code into the ID selector instead.

Don't just use classes because you can.