title: stop span inside href inheriting hover styles from href
body: <p><strong>Problem</strong></p>
  
  <p>I need the span to not have <code>text-decoration: underline</code>. I can not change the markup in anyway. Is this possible?</p>
  
  <p><strong>Mark Up</strong></p>
  
  <pre><code>&lt;a href="#"&gt;
      Working test
      &lt;span&gt;▼&lt;/span&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>a:hover {
      text-decoration: underline;
  }
  
  a:hover span {
      text-decoration: none;
  }
  </code></pre>