I need to apply padding to the TD elements within even TR elements only. Here is my HTML code:
<table class="overview">
<tr>
<td>brokerage</td>
<td>price</td>
</tr>
<tr>
<td>1</td>
<td>26.5L</td>
</tr>
<tr>
<td>rate</td>
<td>build up area</td>
</tr>
<tr>
<td>4818.00 per sq.ft.</td>
<td>550 sq.ft.</td>
</tr>
<tr>
<td>carpet area</td>
<td>floor</td>
</tr>
<tr>
<td>550 sq.ft.</td>
<td>Lower of 4 floor</td>
</tr>
<tr>
<td>posession status</td>
<td>beadroom</td>
</tr>
<tr>
<td>ready to move in</td>
<td>2</td>
</tr>
</table>
Despite selecting the even TR and attempting to add padding, nothing happened.
.overview tr:nth-child(even)
{
padding:20px;
}
The issue arises as this selects the even TD elements across all TRs.
.overview tr td:nth-child(even){
padding:20px ;
}