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

HTML How to Make a Website Responsive Web Design and Testing Build a Three Column Layout

Edwin Neba'a Numfor
Edwin Neba'a Numfor
1,195 Points

The items in my gallery don't form two columns when i resize my browser to minimum as in the video.

Hi in the video when the browser is resized to minimum, the items in the gallery form two columns. I noticed that mine still remained in three columns even though they got resized smoothly enough, and did fit properly in the browser. How can I fix this?

1 Answer

Edwin Neba'a Numfor
Edwin Neba'a Numfor
1,195 Points

Ooh I just found the solution. The two lines below were out of the curly brackets after: @media screen and (min-width: 480px) {}

gallery li {width: 28.3333%;}

gallery li:nth-child(3n+1) {clear:left;}

Once i corrected it as such

@media screen and (min-width: 480px) {

gallery li {width: 28.3333%;}

gallery li:nth-child(3n+1) {clear:left;}

}

Everything worked properly