Fred007 Fred007 - 1 year ago 72
CSS Question

Cannot make table row change color on hover

I made on hover color changer for table data but I want to change it for whole table row on hover, but it doesn't work when I change td:hover to tr:hover. What am I doing wrong?



<div class="content">
<div class="header">

<a name="172016">
<!--1. riadok H-->
<table cellspacing="0" cellpadding="0" border="0">
<th width="50px">C. u.</th>
<th width="30px">Zobrazit</th>
<th width="30px">Typ</th>
<th width="200px">Cislo/Meno</th>
<th width="600px">Popis</th>
<th width="130px">System</th>
<th width="100px">Dopad/Symptom</th>
<th width="100px">Dátum zadania</th>
<th width="100px">Dátum vzniku</th>
<th width="100px">Datum Verifikacie</th>
<th width="80px">Ukoncenie</th>
<th width="500px">Komentár</th>
<th width="100px">Dátum</th>
<th width="60px">Počet</th>
<!--2. riadok D-->
<td style="text-align:center;background-color: #d0f5f6">100</td>
<td style="text-align:center">X</td>
<td style="text-align:center">C </td>
<td class="tooltip">Gefco PC nasa siet CD vs finalne riesenie internet gefco pc CORAIL <span class="ttext">ked sa vytvara uplne novu hypotheza tak nefunguje vyber tlaciarni a globalny export tiez NOK (nepouzivame)</span> </td>
<td class="DZ">06/07/2016</td>
<td class="DZ">06/07/2016</td>
<td class="DZ">06/07/2016</td>
<td style="text-align:center">OK</td>
<td>ked sa vytvara uplne novu hypotheza tak nefunguje vyber tlaciarni a globalny export tiez NOK (nepouzivame)</td>
<td style="text-align:center">07/07/2016</td>
<td style="text-align:center">2</td>


.content {
position: static;

.header {
text-align: center;
position: relative;
margin-top: 40px;

th, td{
border:1px solid black;
overflow: hidden;

background-color: #eff0f0;

background-color: #eed6b1;
height: 50px;
table-layout: fixed;
min-width: 2000px;
border-collapse: collapse;
width: 100%;
margin-left: 5px;

.DZ {
text-align: center;

background-color: #b0b0b0;

Answer Source

Try changing the background color of the td when the row is hovered.

tr:hover td {
    background: #b0b0b0;

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download