title: Why does background-color:none not override a specified background color?
body: <p>My goal is for all cells in a table to have a background color except ones with the class 'transparent'.  Here is some sample code (<a href="http://jsfiddle.net/F2kvf/2/" rel="noreferrer">corresponding jsfiddle</a>):</p>
  
  <pre><code>&lt;style&gt;
      td { background-color: red }
      td.transparent { background-color: none }
  &lt;/style&gt;
  
  &lt;table&gt;
      &lt;tr&gt;
          &lt;td&gt;foo&lt;/td&gt;
          &lt;td class="transparent"&gt;bar&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Why doesn't the td.transparent cell follow the td.transparent css rule?  When I inspect the element the rule is there, but it is getting overridden by the td rule, which seems to break normal css specificity rules.</p>
  
  <p>I can get what I want by using <code>rgba(0,0,0,0)</code> instead of <code>none</code>, but rgba is not supported in IE8 and I would like to avoid using an ugly hack if I could.</p>
  
  <p>I'd also like to simply understand why this isn't working the way I expected.</p>
  
  <p>Thoughts?</p>