JeffVader JeffVader - 2 months ago 6
CSS Question

Applying CSS to Table rows

I've got this table:

<table class="tg">
<tr>
<th>123456</th>
<th>123456</th>
<th>123456</th>
<th>123456</th>
<th>123456</th>
<th>123456</th>
</tr>
<tr class='trip'>
<td>abcdef</td>
<td>abcdef</td>
<td>abcdef</td>
<td>abcdef</td>
<td>abcdef</td>
<td>abcdef</td>
</tr>
<tr>
<td>876543</td>
<td>876543</td>
<td>876543</td>
<td>876543</td>
<td>876543</td>
<td>876543</td>
</tr>
<tr>
<td>AABBCCDD</td>
<td>AABBCCDD</td>
<td>AABBCCDD</td>
<td>AABBCCDD</td>
<td>AABBCCDD</td>
<td>AABBCCDD</td>
</tr>
<tr class='trip'>
<td>abcdef</td>
<td>abcdef</td>
<td>abcdef</td>
<td>abcdef</td>
<td>abcdef</td>
<td>abcdef</td>
</tr>
</table>


and I'd like to colour rows who have a class of
trip


How do I use trip with tg which is assigned to the table ?

I've created a simple fiddle showing this.
https://jsfiddle.net/sagsb415/1/

Thanks

Answer

You have a space in your fiddle between tr and .trip. Try this.

.tg tr.trip {
    padding:5px 5px;
    background-color:#8600b3;
}

https://jsfiddle.net/sagsb415/2/