Created attachment 254203 [details] Rendering comparison between browsers When the browser zoom is zoomed (in or out), viewport unit values are affected, and are no longer relative to the physical viewport. This can lead to layout issues. This behaves as expected in Chrome and Firefox. See http://codepen.io/joeyhoer/full/BcbsH/ for a demo.
Does this still reproduce in a WebKit nightly?
Yes this issue is still present in WebKit r188253 (In reply to comment #1) > Does this still reproduce in a WebKit nightly?
I cannot reproduce. By "browser zoom" do you mean pinch-zoom on the trackpad?
http://codepen.io/hexalys/full/XbGvvW(In reply to comment #3) > I cannot reproduce. By "browser zoom" do you mean pinch-zoom on the trackpad? Joey's example is is not very clear. Here is simple layout with VW units. http://codepen.io/hexalys/full/XbGvvW As you zoom in with CMD +, you can see that the VM units remains based on a 100% zoom. e.g. 50% of the viewport width become 75% at 150% zoom etc.. Other browsers will adjust VW units to the rescaled viewport width according to the zoom ratio. Without that adjustment, all responsive layouts will be affected.
I can confirm the unexpected behaviour: http://data:text/html,<div%20style="width:100vw;height:100vh;background:red"> an object with width of 100vw and height of 100vh has it's dimensions changed when zooming in or out the page which is not the expected behaviour. Firefox seems to implement this accordingly.
<rdar://problem/25880356>
Is there a timeline to fix this issue? :)
Seriously, why isn't this solved yet? It seems a basic premise of viewport-based design, so why is it not being taken seriously after more than 2 full years?
Created attachment 327827 [details] Patch
Comment on attachment 327827 [details] Patch Attachment 327827 [details] did not pass mac-ews (mac): Output: http://webkit-queues.webkit.org/results/5398762 New failing tests: fast/css/viewport-units-zoom.html
Created attachment 327829 [details] Archive of layout-test-results from ews101 for mac-elcapitan The attached test failures were seen while running run-webkit-tests on the mac-ews. Bot: ews101 Port: mac-elcapitan Platform: Mac OS X 10.11.6
Comment on attachment 327827 [details] Patch Attachment 327827 [details] did not pass mac-wk2-ews (mac-wk2): Output: http://webkit-queues.webkit.org/results/5398789 New failing tests: fast/css/viewport-units-zoom.html
Created attachment 327835 [details] Archive of layout-test-results from ews104 for mac-elcapitan-wk2 The attached test failures were seen while running run-webkit-tests on the mac-wk2-ews. Bot: ews104 Port: mac-elcapitan-wk2 Platform: Mac OS X 10.11.6
Created attachment 327836 [details] Patch
Comment on attachment 327836 [details] Patch Clearing flags on attachment: 327836 Committed r225277: <https://trac.webkit.org/changeset/225277>
All reviewed patches have been landed. Closing bug.