I want to give padding to all the TD of even TR only this 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>    

when I select the even TR and try to given padding to it nothing happened

.overview tr:nth-child(even)
{
          padding:20px;
}

when I try this,it selects the even td of all tr

.overview tr td:nth-child(even){
      padding:20px ;
    }

1 Answers

2
Supra On

You have applied the css to tr above, you need to apply it to the td. Try below

.overview tr:nth-child(even) td {
    padding:20px;
}