Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS Unused CSS Stages Media Queries Device-Specific Media Queries

What is device pixel ratio of 1 or 2?

I am taking the Stage 12 Quiz: Media Queries and I am having trouble progressing based on the following questions. Please advise, explain.

Question: If a device has a pixel-ratio of 2, then 1 CSS pixel is displayed as physical pixel(s) on screen.

Question: A device-pixel-ratio of 2 is equivalent to a resolution value of ?


I entered the answer of 192 to both questions but it is returning wrong. I thought I understood but I guess I do not.

I don't want to enter guesses I want to understand the information.

-palacios

1 Answer

Paul Yabsley
Paul Yabsley
46,713 Points

As they say in the video "The device pixel ratio is the ratio between a devices logical pixels and physical pixels". Newer phones have screens with hi-resolution screens. This means they pack double the amount of pixels into the same physical space.

The answer to the first question is 2 because 1 css pixel will be rendered on 2 physical pixels.

The answer to the second question is 192dpi because to estimate the resolution you multiply the device-pixel-ratio by 96. However be sure to include the dpi after 192 otherwise the question doesn't pass.