title: How can I set the background-color of every other row of a table AND highlight row on hover?
body: <p>I'm trying to make a table that has a different background color for every other row, and highlight the row on hover. They both work perfectly separated but when you put them together the highlight on hover doesn't work. Here is my CSS. I might have to do it by using Javascript to do one of the functions...</p>
  
  <pre><code>.tableData tr:hover {
  background-color: #ffff99;
  }
  
  .tableData tr:nth-child(even) { /*(even) or (2n 0)*/
  background: #f1f1f1;
  }
  .tableData tr:nth-child(odd) { /*(odd) or (2n 1)*/
  background: #FFF;
  }
  </code></pre>