title: CSS Hover attribute on sub-element rather than entire element
body: <p>Hopefully this makes sense - my html is as follows</p>
  
  <p>html</p>
  
  <pre><code>&lt;a href="#" class="someclass"&gt;An &lt;span class="sub"&gt;Interesting&lt;/span&gt; Link&lt;/a&gt;
  </code></pre>
  
  <p>where the css is simply color information. What I'd like to do is to make it so when you mouseover the link as a whole only the "sub" information is affected by the hover attribute. While this would be easy enough to do in javascript I was curious as to whether or not css allowed for this behavior. If I were to try to write this it would probably look like </p>
  
  <pre><code>a:hover{
      .sub{color:newcolor};
  }
  </code></pre>
  
  <p>however I've never seen anything like that and obviously it doesn't work</p>