How to disable freezing effects in the last row of a table?

Question

I am using a simple html table with the following css, which will just change the background color on hover.

    html>body tbody.scrollableBody tr:hover>td{
    background-color: #ccc
}

I need to apply this effect for every row of the table except the last row of the table. Anyway, should I handle this exception with css or js?

thank

Answer 1

Use this rule immediately after your rule.

html>body tbody.scrollableBody tr:last-child:hover>td{
    background-color: #FFF 
}

#FFF will match the default background color