[css3-mediaqueries] device-width/device-height on rotatable devices

It's not clear to me from reading the spec what the device-width and 
device-height features should report on devices that can be rotated. From 
what I can make out, Android, iOS and Windows RT devices all behave 
differently in this regard (using the default browsers, so some form of 
WebKit on Android and iOS and IE10 on Windows RT).

On iOS devices, I think the device-width is always reported as the narrowest 
dimension regardless of the orientation of the device. On Windows RT, the 
device-width is reported as the current horizontal dimension and is 
re-evaluated when the orientation changes.

Android devices are somewhere in-between. The device-width is reported as 
the horizontal dimension at the time the page loads, but isn't re-evaluated 
when the orientation changes. However, if mixed with other media queries 
that do refresh on orientation change, I think the device-based media will 
usually then be re-evaluated as well.

I don't have access to a lot of devices to test anymore, so the above 
analysis is partially based on my recollection of past behavior, but I did 
get to do a quick test today on one of each device with a basic 
min-device-width query to confirm.

Also while we're on the subject of device queries, what is the point of the 
reference to square pixels in the device-aspect-ratio example. If a screen 
device has 1280 horizontal pixels and 720 vertical pixels, but they aren't 
square pixels, would the reported device-aspect-ratio be any different from 
16/9? The definition suggests not, but then why mention square pixels at 
all?

Regards
James

Received on Thursday, 7 March 2013 17:30:29 UTC