[Webkit-unassigned] [Bug 61970] CSS 3 media queries device-width, device-height, width, and height are all handled incorrectly.

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=61970


John Mellor <johnme at chromium.org> changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
             Status|NEW                         |RESOLVED
         Resolution|                            |INVALID




--- Comment #4 from John Mellor <johnme at chromium.org>  2013-05-24 11:11:50 PST ---
> the device-width/height reported for Android's browser incorrectly uses the value of the virtual viewport

There is/was a bug that the legacy Android Browser would give a value for device-width measured in device-pixels instead of DIPs (see below for definition of DIPs). So on a 720x1280 Galaxy Nexus with a device-pixel-ratio of 2, it would return a device-width of 720 instead of 360. That bug has been fixed in Chrome for Android.

I've never seen any cases where it returns the size of the virtual viewport though. I suspect you were just seeing the issue above.

> A secondary bug is that the device-width/height and width/height do not change when using a zoom function.

It's very deliberate that the values of width and device-width expressions in media queries do not change when the user pinch zooms. Pinch zooming is a way for the user to temporarily enlarge part of the page; it is not intended to change the layout of the page.

Although CSS always claims to use CSS pixels for everything, CSS is actually just ambiguous. About half the time that they refer to CSS pixels, they really mean "device-independent pixels" (DIPs), which are a fixed multiple of device pixels. For example if window.devicePixelRatio is 2, each DIP is a 2x2 block of device pixels. This is the unit that CSS usually intends when it talks about window sizes. And the width in DIPs of the device doesn't change when you pinch zoom. I agree that it's really confusing for CSS to use the same name to refer to two different units - I encourage you to raise this on www-style.

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.