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

Posted by Raihan Islam
Raihan Islam
508 Points

Huge problem in course How To Build A Wesbite

For some reason I was taking the course how to make a website. And I inserted the code like this so when I minimize the browser window to below 480px the images of the gallery wont skip any blank boxes.

 #gallery li:nth-child (4n) {
    clear: left;
}

For some reason there is a blank box shaped separating my images when I rezie the browser below 480px. I listened to the instructor step by step im so lost I checked everything, my HTML id is correct as well

benfarnham
benfarnham
17,073 Points

Is there anyway you can link more of your CSS?

1 Answer

Pedro Baptista
Pedro Baptista
11,490 Points
Pedro Baptista
Pedro Baptista
11,490 Points

how many columns do you want in your below 480px layout? cause 4 seems too much and the course had 2 if i remember correctly.

gallery li:nth-child (4n) means it will impact on every 4th li inside the #gallery container, clear:left basically means your breaking the flow of the document and forcing the li's to start a new line.

But Ben Farnham is right, without having some more context is kinda hard to find the problem.