```
<div id="top">
  <table>
    <tbody>
      <tr>
        <td>Cell number one content...</td>
        <td>Cell number two content...</td>
      </tr>
    <tbody>
  </table>
</div>

```

Presumably, this CSS should select the entire first cell blue and the second red:

```
  div#top table tbody tr:first-child {
      background-color:blue;
   }
   div#top table tbody tr + tr {
      background-color:red;
   }

```

Instead, this is what happens:
![enter image description here](https://i.stack.imgur.com/UfOAf.jpg)