One small issue with three column gallery responsiveness

Hi Rau,

Your expression is correct but you left off the fact that the 1st child will be selected as well. n starts at zero.

I would suggest not thinking about it as "every 3rd+1 element" because it leads you to missing that the first element is selected too. Similar language is used in the Teacher's notes I linked to as well which can be misleading.

I prefer to think of the expression from right to left, "start with the 1st and then every 3rd after that"

I have also seen others think of it from left to right, "every 3rd element, starting with the first" which works well too.

I think either of these give you an intuitive way to think about it and not miss out on any elements.

Hi Bethany Maxfield, the (3n+1) works as a mathematical formula. "n" is a counter that increments every time, this way you can increase the number of elements and get the same result of three columns ;)

3x1 + 1 = 4

3x2 + 1 = 7

3x3 + 1 = 10

...

Hi Bethany,

I think you might be on the following video? https://teamtreehouse.com/library/how-to-make-a-website/responsive-web-design-and-testing/build-a-three-column-layout

If so, then you'll probably want to take a look at the teacher's notes below the video. I think it will clear up some of the confusion at least.

I'm not sure if you still need further explanation on this but it might help to walk through the thought process of how you might come up with the correct expression on your own given that the design calls for 3 columns.

Regardless of how many columns you want, the important thing is that you want the first item in each row to clear the previous floats.

The first step then is determining which items are the first in each row.

If we look at this numbered 3 column grid

 1  2  3
 4  5  6
 7  8  9
10 11 12

we can see that the first item in each row is going to be 1, 4, 7, 10, and so on

Now it's a matter of recognizing the pattern and figuring out the correct expression to generate those numbers.

Hopefully, you'll be able to recognize that you're always adding 3 to get to the next number. You start with 1 and then you keep adding 3.

nth-child expressions take the form of an + b where you choose integers for a and b and you leave n alone. b is what you start on and a is what you keep adding or subtracting to get to the next number.

So we know that we want to start on 1 and keep adding 3. That gives us the correct expression 3n + 1 that was posted by Rau.

This may seem like a long process to come up with 3n + 1 but once you have some practice then you'll likely be able to do this all in your head within a few seconds.

Hopefully that didn't add to your confusion.