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

Quiz issue on Device-Specific Media Queries

The quiz after the Device-Specific Media Queries videos has two questions that are very similarly worded...

  1. A device-pixel-ratio of 2 is equivalent to a resolution value of ________.

and

2.A device-pixel-ratio of 1 is equivalent to a resolution value of ________ dpi.

A uniform standard of answer here would be helpful... Unless I am missing a reason for the questions being phrased as they are. I think the latter (question 2) format would be easiest for the end user, as it takes out a measure of ambiguity from probable answers.

Thanks... again!

I remember that question and agree.

James Barnett
James Barnett
39,199 Points

Tagging Guil Hernandez to get his thoughts on this

The questions in this particular quiz are very difficult to wrap your head around. I find the wording to be very confusing. You end the lesson thinking you understand only to be even more confused when the questions are asked. I spent more time on google afterwards trying to figure out if I was right or wrong. I was right, just reading the questions wrong. Very confusing

4 Answers

John Salzarulo
John Salzarulo
6,596 Points

I was stumped on this quiz for a while. I kept entering the value "192" instead of "192 dpi". I was so frustrated because I knew it was the right answer and I didn't understand why it was failing. However, I do understand that the unit is just as important as the value. 1,000 dollars vs. 1,000 cents mean very different things.

James Barnett
James Barnett
39,199 Points

I think mentioning in the instructions (don't forget to specify the unit) or something like that. Can help point people in the right direction.

I still think these questions need revision.

Guil Hernandez
STAFF
Guil Hernandez
Treehouse Teacher

Paul Boncher,

The first question accepts a dpi or ppi value as the answer. I gave the "dpi" hint in the second question because that's what we used in the lessons.

Guil

Ryan Boone
Ryan Boone
26,518 Points

Quick follow up, Guil, if a device has a ratio of 2, isn't one device pixel actually represented by four physical pixels?

Guil Hernandez
Guil Hernandez
Treehouse Teacher

Hi Ryan Boone,

Great question.

A device with a pixel ratio of 2 will display 4 times as many total device pixels. But it still only doubles each CSS pixel. For example, let's break down one of the examples in the link you posted.

If an element is set to 200x300 pixels on a regular screen, a device with a pixel ratio of 2 will need to double it at 400x600 to keep the same physical size. It doubles every pixel, but let's take a look at the total result in device pixels:

200 x 300 = 60,000 device pixels
400 x 600 = 240,000 device pixels

60,000 x 4 = 240,000 device pixels

When we double the CSS pixels it results in 4 times as many device pixels.

Hope this helps :)

Ryan Boone
Ryan Boone
26,518 Points

Gotcha. Confusing, but I understand. Do we REALLY need hi-res screens that bad?

James Barnett
James Barnett
39,199 Points

Do we REALLY need hi-res screens that bad?

If you have an Apple hardware fetish then yes, otherwise probably not, no.

https://developer.mozilla.org/en-US/docs/Web/CSS/resolution

dpi This unit represents the number of dots per inch. A screen typically contains 72 or 96 dpi; a printed document usually reach much greater dpi. As 1 inch is 2.54 cm, 1dpi ≈ 0.39dpcm. dpcm

so the answer on the first one is 192 if the screen is 96 dpi

and the second one is 96 if the screen is that big.

But this question are not correct because the screen on all devices change constantly so is not a correct value for this questions.

You are right answer of first is 192 dpi.