CSS nth-child does not work

You need to select the nth tr element rather than the child td element.

Your selector should be:

.UMLTable tr:nth-child(even) td {
    background-color:blue;
}

The reason your CSS isn't working as expected is because the td elements aren't siblings.

.UMLTable tr:nth-child(even) td {
  background-color: blue;
}
<table class="UMLTable">
  <tr>
    <th>Table
      <th>
  </tr>
  <tr>
    <td>Attribute 1
      <td>
  </tr>
  <tr>
    <td>Attribute 1
      <td>
  </tr>
  <tr>
    <td>Attribute 1
      <td>
  </tr>
  </tr>
</table>

Tags:

Css

Css Selectors

Recent Posts