How to combine class and ID in CSS selector?

css, css-selectors

Solution

In your stylesheet:

div#content.myClass

Edit: These might help, too:

div#content.myClass.aSecondClass.aThirdClass /* Won't work in IE6, but valid */
div.firstClass.secondClass /* ditto */

and, per your example:

div#content.sectionA

Edit, 4 years later: Since this is super old and people keep finding it: don't use the tagNames in your selectors. `#content.myClass` is faster than `div#content.myClass` because the tagName adds a filtering step that you don't need. Use tagNames in selectors only where you must!

Problem

If I have the following div: ``` <div class="sectionA" id="content"> Lorem Ipsum... </div> ``` Is there a way to define a style that expresses the idea "A div with `id='content'` AND `class='myClass'`"? Or do you have simply go one way or the other as in ``` <div class="content-sectionA"> Lorem Ipsum... </div> ``` Or ``` <div id="content-sectionA"> Lorem Ipsum... </div> ```

Original source