title: Hover not working with nth-child
body: <p>He I am exploring the features of CSS 3 and I walked into some trouble:</p>
  
  <p>For a table I have made this CSS:</p>
  
  <pre><code>table.sortable tbody tr td {
      border-bottom:1px solid;
      height: 20px;
  }
  
  table.sortable tbody tr:hover {
      background-color:#BCD2E5 !important;
  }
  
  table.sortable tbody tr:nth-child(odd) td {
      background-color: #F3FAFF;
  }
  table.sortable tbody tr:nth-child(even) td {
      background-color: #FFFFFF;
  }
  
  table.new{
      background-color: rgb(255, 255, 187);
  }
  
  table.reaction{
      background-color: rgb(255, 128, 64);
  }
  
  table.send{
      background-color: rgba(154, 211, 109, 0.470588);
  }
  </code></pre>
  
  <p>The problem is that the hover is not working but if I comment the nth-child selector out it does actually work. Also in some cases I have to give some rows different background color's. This is for the users so they can see the status of some stuf really easy. So if I assign a class like <code>class="send"</code> to a row it has to get the background color form the class send.</p>
  
  <p>Why is this not working out?! or did I miss something!?</p>