CSS "and" selector - Can I select elements with multiple classes?

Question

I am trying to select all elements having .checked and .featured . So basically, what I'm looking for is an "and" selector; I don't know if he is or not.

Is there a workaround for such cases?

Answer 1

You use both (without a space between them)

 .checked.featured{ // ... } 

Link: http://www.w3.org/TR/selectors/#class-html

---

Example

 div{margin:1em;padding:1em;} .checked{color:green;} .featured{border:1px solid #ddd;} .checked.featured{ font-weight:bold; } 

 <div class="checked">element with checked class</div> <div class="featured">element with featured class</div> <div class="featured checked">element with both checked and featured classes</div> 

Answer 2

You can simply “join” two such classes: .checked.featured

Answer 3

To express And you simply combine your classes .checked.featured , which cannot be confused with the popular .checked .featured , which is a descendant selector.

Check out the official documentation