I want to create separate layouts for small vs big screens. Nowadays smartphones come with very high resolutions so counting on pixels won't cut it. Is there a way to know screen size in inches and style accordingly?

Thanks

ralphm
—
2012-10-04T00:26:34Z —
#2

EvanGR said:

Nowadays smartphones come with very high resolutions so counting on pixels won't cut it.

Actually, they do cut it, because those phones still act as if they were smaller. That is, even though the iPhone has far more px than 320 horizontally, it still respects rules for that width (or acts as if it is 320px wide). So you can still use settings like these:

(I'm not using the right terminology here, but hopefully you get the idea.)

felgall
—
2012-10-04T06:59:45Z —
#3

You can't test for screen size using media queries. You can only test for viewport size (which is only the same thing when the browser displays the web page using the entire screen with no space taken up with browser controls or anything wlse).