title: Debugging nth-child selector
body: <p>I have the following selectors:</p>
  
  <pre><code>.progress:nth-child(3n+1) {
      background: teal;
  }
  
  .progress:nth-child(3n+2) {
      background: red;
  }
  
  .progress:nth-child(3n+3) {
      background: blue;
  }
  </code></pre>
  
  <p>However all of the items end up with a teal background. Are these selectors correct? I'm thinking I should get:</p>
  
  <ol>
  <li>Teal (every 3, starting with 1)</li>
  <li>Red (every 3, starting with 2)</li>
  <li>Blue (every 3, starting with 3)
  etc.</li>
  </ol>
  
  <p>I've tested on Firefox 3.5.8 and Opera 10.10 on Ubuntu. Also tested with nothing but these rules in the CSS. I'm using the YUI Reset stylesheet but excluding it does nothing.</p>