Useful :nth-child Recipes

Posted September 26th, 2011 in HTML and CSS and Offsite Articles

While answering a question asked on another post, I needed to work out how to use the CSS nth-child selector to find everything but the first element, and came across an excellet post by Chris Coyier at css-tricks.com.

Useful :nth-child Recipes at css-tricks.com

Chris covers the nth-child and last-child selectors in a really easy to understand visual manner which clarified for me some of the confusion I've had in the past how they work.

Examples are:

• select only the fifth element
• select all the but the first five
• select only the first five
• select every fourth, starting at the first
• selecting only odd or even
• select the last element
• select the second to last element

It's then easy to change the values in his examples to whatever is required in your own code.

Go check out his page here. I've posted this here, because I often use my own blog to bookmark useful articles on other blogs :)