Displaying element position it's not accuarate.
Reported by
mkrawczy...@gmail.com,
Dec 29 2017
|
||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.108 Safari/537.36 Example URL: Steps to reproduce the problem: 1. Example html <html> <body> <div style="transform: scale(2);transform-origin: 0px 0px 0px"> <div style="background-color:black;position:absolute;width:213.26266666666666px;height:127.95733333333334px;display:block;transform:matrix(1,0,0,1,135.99466666666666,135.85866666666666);"> </div> <div style="background-color:grey;width:200px;height:123.956px;display:block;transform:matrix(1,0,0,1,349.25733333333335,139.86);" > </div> </div> </body> </html> 2. Try it on 100% zoom it displays small space between rectangles. 3. On 110% zoom there is no space between rectangles and they are overlapping. What is the expected behavior? On Firefox or Edge rectangles are snapped to each other without any space and look the same on all zoom levels. What went wrong? On some zoom levels there is space between rects on some there is not. On other browser(Firefox, Edge) rects are always aligned without any spaces or overlapping. Does it occur on multiple sites: N/A Is it a problem with a plugin? N/A Did this work before? N/A Does this work in other browsers? Yes Chrome version: 63.0.3239.108 Channel: stable OS Version: 10.0 Flash Version:
,
Dec 29 2017
,
Jan 1 2018
Able to reproduce this issue on reported version 63.0.3239.108 and on latest canary 65.0.3309.0 using Windows 10, Mac 10.13.1, Ubuntu 14.04 with given hrml code. i.e; Spacing is seen and on changing zoom level overlapping is seen This issue is seen from M50[50.0.2661.0]. Hence considering this issue as Non-Regression and marking as Untriaged. Thanks!
,
Jan 2 2018
The reason this is a serious real-world issue for us is that we have a graphics application that uses transforms for zoom (as you would), and this issue results is significant, sometimes 10s of px, rendering errors. Only goes wrong in Chrome.
,
Jan 5 2018
Transforms apply after layout and after snapping to the device pixel grid in Chrome. Combining regular sizing/positioning with transforms is therefor *not* guaranteed to match. Safari works the same way.
,
Mar 5 2018
You appear to be suggesting this bug is 'wont fix' because another browser has the same flaw. But Edge and Firefox (and even IE) work correctly. And pixel snapping before the transform will, as you must understand, scale the error, so a half pixel snap adjustment becomes a 50 pixel error at high zoom. Whereas other browsers (and all graphics programs I know) increase accuracy, not decrease it as you scale up. The snapping to a pixel grid is done as the last thing (when actually rendering to the pixel grid), not the first. Coordinates are floating point, and to say 'Chrome only works at whole pixel values' means transforms cannot be used for scaling up. Which surely is the point of CSS transforms? |
||||
►
Sign in to add a comment |
||||
Comment 1 by dtapu...@chromium.org
, Dec 29 2017