Bootstrap table row hover

Question

How do I make the background change of a table row in Bootstrap 3 on hover. The table class I am using right now is table table-striped. I tried to add a extra class to the <tr> tags within the table and made the css like this .table-row:hover{background:black;}. Now only the non-striped rows are working. Isn't there a class in bootstrap that will allow me to easily implement this? Or should I use JQuery to fix this? I really cannot figure this one out by myself.

Answer 1

You need to add the table-hover class to the <table/> element. Like this:

<table class="table table-striped table-hover">     <tbody>        <tr>            <td>Col 1</td>            <td>Col 2 </td>        </tr>     </tbody> </table> 

Source: Documentation