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

Aliya Ladhani
Aliya Ladhani
1,316 Points

Implementing Media Queries Code Challenge

Hi... i'm a little bit stuck on the Implementing Media Queries, Code Challenge. The first challenge: "Add the appropriate CSS code to the CSS to make images scale with the fluid layout." I've watched the video 3 times and I'm not getting it. Please help!

5 Answers

Make sure you add the grid with in the media queries

/media queries/ @media screen and (max-width:705px){ .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6 { width:100%; }

Aliya Ladhani
Aliya Ladhani
1,316 Points

Shouldn't that be on the style.css file?

Stephen Hall
Stephen Hall
2,668 Points

This is actually very simple, but perhaps confusingly it refers back to something learned on the previous stage, not the preceding video. You're probably trying to over-complicate it (as I did at first) because your head's full of what you just watched. You just need one short line of code to, as the question says, make the image scale with the rest of the layout.

This is the style.css file you're looking at, but it's all in one file here, unlike in your version where it's separated out.

A little continuity would be helpful right? This section is not put together well.

Aliya Ladhani
Aliya Ladhani
1,316 Points

Got it (finally)!!! Thanks Stephen and Kelly!

I also got stuck it on step 1 I tried to add all different codes.... GOT IT!!!! Finally......