title: tr:hover not working
body: <p>I'm trying to highlight (change background color) of the entire row when the mouse is hovering on a table row. I searched through the Net and it should be working, but it doesn't. I'm displaying it on Chrome.</p>
  
  <pre><code>&lt;table class="list1"&gt;
  &lt;tr&gt;
     &lt;td&gt;1&lt;/td&gt;&lt;td&gt;a&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
     &lt;td&gt;2&lt;/td&gt;&lt;td&gt;b&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
     &lt;td&gt;3&lt;/td&gt;&lt;td&gt;c&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>my css:</p>
  
  <pre><code>.list1 tr:hover{
  background-color:#fefefe;
  }
  </code></pre>
  
  <p>The correct css should be:</p>
  
  <pre><code>.list1 tr:hover td{
  background-color:#fefefe;
  }
  
  //--this css for the td keeps overriding the one i showed earlier
  .list1 td{
  background-color:#ccc000;
  }
  </code></pre>
  
  <p>Thanks for the feedback guys!</p>