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

Guil Hernandez
STAFF
Guil Hernandez
Treehouse Teacher
Posted by Guil Hernandez
Guil Hernandez
Treehouse Teacher

New CSS Deep Dive: Media Queries

Hey everyone,

We just released the final stage of the new CSS Foundations! If you want to learn all about media queries, check it out.

Media Queries allow designers to apply CSS declarations dynamically based on client conditions. Using media features like width, height, and color, we can tailor our content to a wide range of devices and resolutions without having to change the content itself.

7 Answers

Elliott Frazier
PLUS
Elliott Frazier
Courses Plus Student 9,647 Points
Elliott Frazier
Elliott Frazier
Courses Plus Student 9,647 Points

Awesome work Guil! Cant wait to get started! Now that your done with CSS Foundations do you plan to teach another course?

Guil Hernandez
Guil Hernandez
Treehouse Teacher
Guil Hernandez
Guil Hernandez
Treehouse Teacher

Thanks, Elliott Frazier.

Absolutely! Exciting new courses and workshops are in the works –– announcements soon :)

Elliott Frazier
Elliott Frazier
Courses Plus Student 9,647 Points

Cool! looking forward to it

Scott Paterson
Scott Paterson
26,869 Points
Scott Paterson
Scott Paterson
26,869 Points

Really enjoying this course so far Guil, the information is sticking to me very easy, great job from you and the team :)

Brandon Kidd
Brandon Kidd
18,141 Points
Brandon Kidd
Brandon Kidd
18,141 Points

Glad to see the final course added. Hope to get through the second half of CSS Foundations badges this weekend.

Steven Schweibold
Steven Schweibold
7,742 Points
Steven Schweibold
Steven Schweibold
7,742 Points

Thanks Guil Hernandez for the new deep dive!

Guil Hernandez
Guil Hernandez
Treehouse Teacher
Guil Hernandez
Guil Hernandez
Treehouse Teacher

You're very welcome. Thanks for learning with Treehouse, Steven.

Chase Lee
Chase Lee
29,275 Points
Chase Lee
Chase Lee
29,275 Points

Getting started now!

jeff creamer
jeff creamer
23,733 Points
jeff creamer
jeff creamer
23,733 Points

Great section, Guil Hernandez Was that a browser dev tool or extension that showed the widths in the bottom right hand corner? And what do you currently like to use for simulators? Thanks for the Deep Dive.

Guil Hernandez
STAFF
Guil Hernandez
Treehouse Teacher
Guil Hernandez
Guil Hernandez
Treehouse Teacher

Hi jeff creamer,

I used Chrome's Window Resizer extension.

For device testing, I like to use the iOS Simulator I used in the Deep Dive along with the Android emulator. But take a look at this free, handy new app for RWD testing and iOS / Android device preview!

James Barnett
James Barnett
39,199 Points

I like http://responsivepx.com/ it's great for debugging tricky media queries, as you can specify the exact pixel sizes.

jeff creamer
jeff creamer
23,733 Points

Thanks, Guil and James.