How to change background color of TR on hover?

Viewed 28

I am trying to highlight the entire row of my table when user hovers over it. But only the TD changes background color instead of the entire row.

CSS:

.addItem_tr :hover{

background: blue;

}

Html

<table>
          <thead>
          <tr>
            <th width="15%" ></th>
            <th width="35%" ></th>
            <th width="50%" ></th>
          </tr>
          </thead>
        <tbody>
        <tr className="addItem_tr">
            <td className="td_add_serviced_item" >{item.quantity}</td>
            <td className="td_add_serviced_item" >{item.productID}</td>
            <td className="td_add_serviced_item" >{item.productInfo.productDescription}</td>
            </tr>
    <tr className="addItem_tr">
            <td className="td_add_serviced_item" >{item.quantity}</td>
            <td className="td_add_serviced_item" >{item.productID}</td>
            <td className="td_add_serviced_item" >{item.productInfo.productDescription}</td>
            </tr>
       
        </tbody>
        </table>

Highlights only td

0 Answers
Related