Using nth-child to style item 4 and onwards

Problem

I have a list item where I'd like the 4th item and onwards to have a different background-color.

I've tried the following:

li:nth-child(4) { background-color:blue; }

This styles only the 4th item. I then tried the following in the hope that it would style 4th item and onwards, but it didn't work:

li:nth-child(4+) { background-color:blue; }

How can I get this to work without having to specify 4th, 5th, 6th, 7th etc...?

Problem courtesy of: Curt

Solution

Use :nth-child(n+5) (CSS indexes start at 1).

Demo: http://jsfiddle.net/nTZrg/1/

li:nth-child(n+5) {
    background-color:blue;
}
Solution courtesy of: Rob W

Discussion

You need to do this

li:nth-child(n+5) { background-color:blue; }

Example: http://jsfiddle.net/jasongennaro/2p4e9/1/

Discussion courtesy of: Jason Gennaro

This recipe can be found in it's original form on Stack Over Flow.