Question

How do I query for an element that have two classes at the same time?

For example:

<div><span class='major minor'>Test</span></div> 

I want to style all the spans that have ‘major’ and ‘minor’ classes at the same time.

Answer 1

The following should do the trick:

span.major.minor { color: red; } 

Note you have to be careful with this with Internet Explorer 6 – it will only read the last class of the selector. For example, it will incorrectly apply the rule above to the following:

<span class='minor'>Test</span>