Changing background colour of tr element on mouseover

Question

I want to have my table rows highlighted on mouse over, but I have yet to find a way to do it that isn\'t using Javascript. Is this not possible in CSS?

I\'ve tried this

Answer 1

I had the same problem:

tr:hover { background: #000 !important; }

allone did not work, but adding

tr:hover td { background: transparent; }

to the next line of my css did the job for me!! My problem was that some of the TDs already had a background-color assigned and I did not know that I have to set that to TRANSPARENT to make the tr:hover work.

Actually, I used it with a classnames:

.trclass:hover { background: #000 !important; }
.trclass:hover td { background: transparent; }

Thanks for these answers, they made my day!! :)

Answer 2

tr:hover td.someclass {
   background: #EDB01C;
   color:#FFF;
}

only someclass cell highlight

Answer 3

<tr>s themselves are very hard to access with CSS, try tr:hover td {background:#000}