CSS scale and browser zoom + iframe = rounding errors
Reported by
gavin.he...@gmail.com,
Nov 21 2017
|
|||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36 Steps to reproduce the problem: 1. Open index.html (either from the attachment or via https://plnkr.co/edit/IUfX1IXFEVDCnQdLSpcg?p=preview) in either Chrome 62 (stable) or Chrome 62 (dev). 2. Change browser zoom, noting especially 75%, 33% and 25%. What is the expected behavior? The circle should remain centred and round. What went wrong? 1. The circle is vertically and horizontally off-centre at 75% zoom - severely so at 33% zoom. 2. The circle is cropped at 33% and 25% zoom. Did this work before? No Does this work in other browsers? Yes Chrome version: 62.0.3202.94 Channel: stable OS Version: 10.0 Flash Version: Shockwave Flash 27.0 r0 There appear to be rounding errors when zooming a document with an iframe. These are exacerbated if a CSS scale transform is applied as well. Regarding other browsers - I have observed some issues (e.g. cropping is evident in Firefox 57 and centring is not perfect in Safari 11) but the issue is most severe in Chrome.
,
Nov 21 2017
,
Nov 23 2017
Unable to reproduce this issue on reported version 62.0.3202.94 using Windows 10 with steps mentioned in comment#0. 1. Navigated to Link: https://plnkr.co/edit/IUfX1IXFEVDCnQdLSpcg?p=preview 2. Changed the browser zoom to 75%, 33%, 25% 3. The circle didn't get cropped @Reporter: Could you please check the video and let us know if we have missed anything. This would help in further triaging of the issue. Thanks!
,
Nov 24 2017
Hi, thanks for the video. Can you please try opening the document separately rather than in the Plunker editor window? You can do this by following the URL and then clicking the blue icon at the top right ("Launch the preview in a separate window"). For me this makes the effect much more pronounced. I have attached screenshots to demonstrate.
,
Nov 24 2017
Thank you for providing more feedback. Adding requester "divya.padigela@techmahindra.com" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Nov 27 2017
Probably UI>Browser>Zoom is a better owner than Blink>HTML. If this is mis-routed, please move it back to Blink>HTML.
,
Nov 28 2017
gavin.heise@ Thanks for the issue. Able to reproduce the issue on Win-7 & 10,Ubuntu 14.04,Mac OS 10.12.6 using chrome reported version stable #62.0.3202.94 and canary #64.0.3278.0 following the below steps. 1.Navigated to Link: https://plnkr.co/edit/IUfX1IXFEVDCnQdLSpcg?p=preview 2.On Clicking the blue icon at the top right "Launched the preview in a separate window" 3.Changed the browser zoom to 75%, 33%, 25% and observed the circle is vertically and horizontally off-center at 75% zoom - severely so at 33% zoom and also the circle is cropped at 33% and 25% zoom. This behavior is observed from M50 chrome builds. Hence marking this as Untriaged for further updates from Dev. Thanks..
,
May 8 2018
Just ran into a similar problem when the Windows text scaling was set to 150%
,
Nov 20
**UI Mass Triage** This issue is still reproducible on latest canary #72.0.3616.0. Adding appropriate labels. |
|||||||||||
►
Sign in to add a comment |
|||||||||||
Comment 1 by gavin.he...@gmail.com
, Nov 21 2017