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 Rory Matthews
Rory Matthews
2,287 Points

Resizing Flex Items Based on Media Queries (Please help me understand some code I've been given)

Hi all,

I have the following codepen from the CSS-Tricks 'Complete Guide to Flexbox':

http://cdpn.io/vIacp

I am having trouble understanding why, when the various media query rules are applied, the various sections of their basic 'Holy Grail' style layout are wrapping to their own lines.

I have commented the code with what I understand to be happening and I'd be super grateful if anyone would be so kind as to give it a quick read-through and correct me where I have misunderstood/explain where I don't understand.

Thanks a lot,