It’s lower width (and height) because the screen is smaller. Remember that in CSS, px is not a physical screen pixel. It’s actually defined in the spec as an angular size[1]. In practice users might adjust their display preferences to suit their eyes. I would not recommend trying to compensate for physical display size, and instead let the user and the browser handle that.
Resolution can be targeted with other media queries, which should be useful for other high-resolution devices. And separate from this you should target touchscreens with a `pointer: coarse` query.
This is exactly why you should not think in terms of mobile, tablet, desktop, but instead in terms of features of the output media.
Resolution can be targeted with other media queries, which should be useful for other high-resolution devices. And separate from this you should target touchscreens with a `pointer: coarse` query.
This is exactly why you should not think in terms of mobile, tablet, desktop, but instead in terms of features of the output media.
1: https://www.w3.org/TR/CSS22/syndata.html#img-pixel1