title: Combining two selectors in CSS3
body: <p>Is there anyway to combine two selectors? such as:   </p>
  
  <pre><code>#div:hover:not(.class)
  </code></pre>
  
  <hr>
  
  <p>Edit:</p>
  
  <p>I understand this work as I wrote. However, how can I achieve a "hover" effect for a "LI" element , but exclude the hover effect when the mouse is over a certain "DIV' inside the LI?</p>
  
  <p>E.G.</p>
  
  <pre><code>&lt;li&gt;Hello   &lt;div id="#no-hover"&gt;Bye&lt;/div&gt;  &lt;/li&gt;
  </code></pre>
  
  <p>I would like to get a hover effect for the li:</p>
  
  <pre><code>li:hover{ text-color:#CCC; }
  </code></pre>
  
  <p>but somehow exclude the hover effect when the mouse is over the #no-hover div.</p>
  
  <p>Any ideas?</p>