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 Selectors Basic Structural Pseudo-Classes

Jamie Allison
Jamie Allison
3,358 Points
Posted by Jamie Allison
Jamie Allison
3,358 Points

Practical uses for 'child' pseudo classes?

I'm just wondering if there are many practical uses for 'child' pseudo classes? I can totally understand the practical uses for other pseudo classes (link, hover, visited etc) however am just trying to wrap my head around any uses of 'child' pseudo classes.

I understand the examples he's giving, however it seems to me like these classes wouldn't really serve a practical function for most sites, or even may cause issues if you were to go back and edit your HTML and render them useless, or cause them to affect elements which they weren't originally supposed to!

If someone could give me some practical examples of where 'child' pseudo classes would be helpful on a site I'd really appreciate it as i think it may help me better understand them.

Maybe I'm missing something, or misunderstanding but hey, I'm here to learn!

Thanks in advance!

3 Answers

robertm
robertm
13,570 Points
robertm
robertm
13,570 Points

Some uses off the top of my head

  1. in the navigation creating the last button a call-to-action button such as 'contact'

  2. in a list item making every even number a different shade for users to be able to read and understand the content better

  3. as Kelly said, you can use it for extra spacing if you need to

Chris Coyier has a good article on it and explains the uses of them http://css-tricks.com/pseudo-class-selectors/

Kelly von Borstel
Kelly von Borstel
28,880 Points
Kelly von Borstel
Kelly von Borstel
28,880 Points

I sometimes use last-child on a list when I want additional margin after the last list item, to create more separation between the list and whatever comes next.

Jamie Allison
Jamie Allison
3,358 Points
Jamie Allison
Jamie Allison
3,358 Points

Thanks for the replies! I can totally see the uses for nth-child, it was more the first, last, but most particularly only-child that i was wondering about.

Are there many uses for 'only-child'? this was the one that i thought could cause the most issues if you had to edit your HTML or something, and also the one that seems vaguely pointless! Haha. Couldn't the same effect be applied by specifying the particular element you wish to style, and wouldn't that reduce the chance of bugs if you were to edit your HTML at a later date?

Again thanks so much for your time and responses! Great to see so many helpful people here. I just started here a few days ago and am loving it! I've already learned more than I did in months of messing around with coding and basic website building on my own!