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 How to Make a Website Responsive Web Design and Testing Build a Three Column Layout

Alexandru Dan Dodu
Alexandru Dan Dodu
2,910 Points

Shouldn't be :nth-child(3n+1) instead of :nth-child(4n)

I think it should be :nth-child(3n+1) instead of :nth-child(4n)

2 Answers

Hi Alexandru,

You're correct. For the general case of an unknown number of images, it should be 3n + 1

The "Teacher's Notes" below the video has a code correction for this.

SERGIO RODRIGUEZ
SERGIO RODRIGUEZ
17,532 Points

Hi Alexandru,

You can think that the argument of the nth child selector works like this:

  • "an+b":

  • a = target every "a" elements

  • b = being "b" the first element selected

So an argument of 3n+1 reads: "target every 3 elements being 1 the first element selected". This means that in a list of 10 elements, elements 1, 4, 7 and 10 will be targeted.

On the other hand 4n reads: "target every 4 elements being 0 de first element selected". This means that in a list of 10 elements, elements 0, 4 and 8 will be targeted.

As you can see, both arguments lead to different results, which means they are not the same. Keep in mind that 3n+3 will indeed lead to the same results as 3n.

Best regards,

Sergio