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

Posted by Matt S
Matt S
1,497 Points

Media Query Selection Choice...

Nick states to set up a 3 column layout to take advantage of desktop screen sizes.

But, in the video, why does he place the 3 column layout CSS that targets desktop sizes under the 480px break, and not the 660px break?

2 Answers

Julian Aramburu
Julian Aramburu
11,368 Points
Julian Aramburu
Julian Aramburu
11,368 Points

Hi Matt! That's because he's using "min-width" ...so it means that when the device-width is equal or greater than ...do this... so he wants that whenever the screen gets equal or greater than 480px you get a 3 columns layout that's why he is placing the css under that media query.

Hope you find this answer useful!

Cheers and Keep Coding!

Matt S
Matt S
1,497 Points
Matt S
Matt S
1,497 Points

Thanks Julian.

I understand he is using "min-width", and what it will do once it reaches 480px. I am just wondering why he didn't put it under 660px, since he stated the 3 column layout was a desktop option; it would go to 3 columns when it hits 660px, but he has it under 480px. 3 columns seems cramped to me with anything under 550px.