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

Karl Pupé
Karl Pupé
6,718 Points
Posted by Karl Pupé
Karl Pupé
6,718 Points

media queries and display sizes

Hi Guys!

I am currently doing the CSS layout course with Guil (who is awesome by the way) and he talks a lot about using media queries so that our site layout will fit different devices by their relative pixel values.

I was wondering is there a chart or diagram that will tell you the definite list of different display sizes in pixels so that I can set my media queries currently. As I am a newbie, I don't have a clue what should be the min-width and max-width of my sites.

Thank you in advance guys!

1 Answer

anil rahman
anil rahman
7,786 Points
anil rahman
anil rahman
7,786 Points

I don't know about a diagram but, if you go to a site like treehouse and in google chrome browser in the menu button in right corner that setting kinda button, click that and go to more tools and go to developer tools.

Once in their you will see at the very top in says responsive with like pixel sizes of the screen, you can change this for default device screens it gives you like iphones and s3 and tablets and laptops. It gives you these pixel screen sizes you are after.

Karl Pupé
Karl Pupé
6,718 Points
Karl Pupé
Karl Pupé
6,718 Points

Thank you again Anil! I will look into that! :)