I ran into the situation today where I wanted to use :nth-child(x), but this won't work in IE8. Since the majority of our user base is still using IE8, I had to address this issue. If you don't want to use a separate class for each one, there is a solution. first-child nth-child(2) nth-child(3) li a{color:#fff;} li:first-child a{ background:#333; } /* :first-child is supported */ li:first-child + li a{background:#666; } /* :nth-child(2) */ li:first-child + li + li a{background:#999; } /* :nth-child(3) */ See for yourself: This obviously is not a solution for cases like :nth-child(odd) but it's a nice way to handle cases where you want to control an element based on a specific sibling distance from the first child, such as centering the text of the second column in a table.
Lessons learned and interesting tidbits from my adventures in web development