Question

I’ve been trying to make a colored table with even rows with class item a different color than the odd ones.
Please, see fiddle: http://jsfiddle.net/x7XT5/

HTML:

<table>
  <tr class="item">
      <td>1</td>
  </tr>
<tr>
    <td>info</td>
</tr>
  <tr class="item">
      <td>2</td>
  </tr>
<tr>
    <td>info</td>
</tr>
  <tr class="item">
      <td>3</td>
  </tr>
<tr>
    <td>info</td>
</tr>
  <tr class="item">
      <td>4</td>
  </tr>
<tr>
    <td>info</td>
</tr>
</table>
​

CSS:

table tr.item:nth-child(2n)
{
    background-color: yellow;
}

table tr.item:nth-child(2n+1)
{
    background-color: red;
}

How to make it work in css?

UPD1

<tr> without class item must be on white background.
<tr class="item">‘backgrounds must be red/yellow on even/odd positions.
​

Answer 1

table tr
{
    background-color: yellow;
}

table tr.item:nth-child(2n+1)
{
    background-color: red;
}

update: Here you go:

table tr {
    background-color: white;
}

table tr.item:nth-child(n)
{
    background-color: red;
}

table tr.item:nth-child(4n+1)
{
    background-color: yellow;
}