Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Foundations Advanced Selectors Pseudo-Classes: :nth-of-type and :only-of-type

Adolfo Hernandez
Adolfo Hernandez
3,633 Points
Posted by Adolfo Hernandez
Adolfo Hernandez
3,633 Points

Confused about advanced selectors...

Is not clear to me what's the difference between :nth-child and :nth-of-type selectors, Aren't they suppose to do the same?

Is there any procedure that we could follow in order to choose which selector we should use? Or is it based on experience? There's a ton of them!

2 Answers

Eric Burdett
Eric Burdett
5,963 Points
Eric Burdett
Eric Burdett
5,963 Points

http://css-tricks.com/the-difference-between-nth-child-and-nth-of-type/ This is a great example of the differences of what you're asking about. Basically nth of type can become much more specific when it's necessary. Be sure to pay careful attention to the example code and the corresponding explanations.

Adolfo Hernandez
Adolfo Hernandez
3,633 Points
Adolfo Hernandez
Adolfo Hernandez
3,633 Points

Thanks Eric, very helpful link, I had to read it several times but I think I got it? One thing that stress me out is that I read another articles of that page and there's a lot of combinations with selectors, how can we know which one we have to use? What should we think of first? Our web design or the selector we are going to use in our design? Can we looking at our design determine If we need some particular selector?