Question: even/odd styles set on tablerows but hovering of table rows don't work .  

*Try it on : <http://jsfiddle.net/w7brN/>*

**CSS style :**

```css
#table_even tr:hover { background-color:#fffbae!important; } /* hovering */

#table_even tr:nth-child(odd) td { background-color:#fbfbfb } /*odd*/
#table_even tr:nth-child(even) td { background-color:#e8ecee } /* even*/

```

**HTML Codes:** 

```
<table id="table_even" style="width: 100%">
    <tr>
        <td>##</td>
        <td>##</td>
    </tr>
    <tr>
        <td>##</td>
        <td>##</td>
    </tr>
    <tr>
        <td>##</td>
        <td>##</td>
    </tr>
</table>

```

how can be solve ?

Answer: 
You need to re-order the CSS and add the `<td>` like so this:

```css
   #table_even tr:nth-child(odd) td {
    background-color: #fbfbfb
} /*odd*/
#table_even tr:nth-child(even) td {
    background-color: #e8ecee
} /* even*/
#table_even tr:hover td {
    background-color: #fffbae;
} /* hovering */

```

Otherwise the nth-child rules will always have precedence over the hover, aswell as you added the background-color to the `<tr>`, not the `<td>`s before.
```
#table_even tr:hover { background-color:#fffbae!important; } /* hovering */

```

You are just missing the `td`. Try:

```
#table_even tr:hover td{ background-color:#fffbae!important; } /* hovering */

```