Multiple Classes on an Element

[Xenonsoft]

This may seem pretty n00bish but I was just wondering if it was possible to have 2 classes on one element.

Turns out it is, all you have to do is have a space between them, inside one class declaration (i think that's the right word..).

Such as:

.this { background-color:#fff; font-size:14px; }

.left { float:left; }

<div class="this left">whatever</div>

Obviously that also shows that you can't have classes with spaces in.

Finally, the precedence goes from right to left, so if you had a conflict then the rules in .left {} would be applied. I assume Harry knew this but a few of us may not

EDIT: Wrong place, please move to Web Development.

 

[Kevin]

I knew that. But it doesn't go from right to left (in the HTML), it goes from bottom to top in your css.

<div class="left this">whatever</div>
That doesn't mean .this {} will dominate .left {}

EDIT: I forgot that overruling is based on how specific the selector is. I can't remember exactly which is which, but it's the same principal that makes an id bigger than a class. ID specificity is 100, class is like only 20 I think.

EDIT2: CSS Specifity: Things You Should Know

 

[Xenonsoft]

Ah right, what I read was either wrong or misleading.