Debugging nth-child selector
- by Ross
I have the following selectors:
.progress:nth-child(3n+1) {
background: teal;
}
.progress:nth-child(3n+2) {
background: red;
}
.progress:nth-child(3n+3) {
background: blue;
}
However all of the items end up with a teal background. Are these selectors correct? I'm thinking I should get:
Teal (every 3, starting with 1)
Red (every 3, starting with 2)
Blue (every 3, starting with 3)
etc.
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.