More than One Nth-Child

Question

Can I use more than one nth-child selctor for a class?

For example,

.span4:not(nth-child(1)):nth-child(3n+1) {
  background-color: red
}

I want to target the 4th, 7th, 10th, etc., except the 1st one.

If there's a better way of doing this, please let me know.

Thanks guys!

Answer 1

You can use the combined selector :not(nth-child(1)):nth-child(3n+1), but it is easier and simpler to use :nth-child with an argument that matches the children you wish to match, in this case :nth-child(3n+4).

Answer 2

You're missing a colon before nth-child:

           |
.span4:not(:nth-child(1)):nth-child(3n+1) {
    background-color: red
}

Here's the fiddle: http://jsfiddle.net/7hcY2/