title: Can you target an element with CSS only if 2 classes are present?
body: <p>As you probably already know, you may have multiple classes on elements separated by a space.</p>
  <h3>Example</h3>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class=&quot;content main&quot;&gt;&lt;/div&gt;
  </code></pre>
  <p>And with CSS you can target that <code>div</code> with either <code>.content</code> or <code>.main</code>. Is there a way to target it if <em>and only if</em> both classes are present?</p>
  <h3>Example</h3>
  <pre class="lang-html prettyprint-override"><code>&lt;div class=&quot;content main&quot;&gt;I want this div&lt;/div&gt;
  &lt;div class=&quot;content&quot;&gt;I don't care about this one&lt;/div&gt;
  &lt;div class=&quot;main&quot;&gt;I don't want this&lt;/div&gt;
  </code></pre>
  <p>Which CSS selector would I use to get the first <code>div</code> only (assume I can't use <code>.content:first-child</code> or similar)?</p>