UserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:53.0) Gecko/20100101 Firefox/53.0
Example URL:
https://jsfiddle.net/FrankPrins/278jt6q8/1/
Steps to reproduce the problem:
1. Navigate to any page which has a block element with a border and a set width within a parent element that has the same width as the element. For example: https://jsfiddle.net/FrankPrins/278jt6q8/
2. Zoom out to any of the following percentages: 90%, 80%, 75%, 67%, 50%, 33%, 25%
What is the expected behavior?
The expected behaviour is that zooming on the page has no effect on block elements with fixed sizes.
What went wrong?
Using the inspector i see that the border and width of the elements change depending on the zoom level.
The change in border width is upwards and significant (+3px or +300% on 1px border, +2px or +100% on 2px border) and results in shifting of elements.
The change in the width of the element itself is only minor (0.010 - 0.031) and down, not resulting in any distortion of layout.
Padding and Margin sizes are not affected in any way by zooming (Not reflected in the example).
In the case of the 1px border, the actual border seems to be the correct border size divided by the percentage. ( 1/.9= 1.111)
In the case of the 2px border, only the percentages 33 and 25 are affected.
The results are below:
1PX BORDER
100%
border: 1px
Width: 58px
90%
border: 1.111px
Width: 57.986px
80%
border: 1.250px
Width: 57.988px
75%
border: 1.333px
Width: 58px
67%
border: 1.500px
Width: 57.984px
50%
border: 2px
Width: 58px
33%
border: 3px
Width: 57.984px
25%
border: 4px
Width: 58px
2PX BORDER
100%
border: 2px
Width: 56px
90%
border: 1.997px
Width: 55.990px
80%
border: 1.992px
Width: 55.996px
75%
border: 2px
Width: 56px
67%
border: 1.992px
Width: 55.992px
50%
border: 2px
Width: 56px
33%
border: 3px
Width: 55.969px
25%
border: 4px
Width: 56px
Does it occur on multiple sites: Yes
Is it a problem with a plugin? No
Did this work before? N/A
Does this work in other browsers? Yes
Chrome version: 58.0.3029.110 Channel: stable
OS Version: 10.0
Flash Version: N/A
Comment 1 by frnkprn...@gmail.com
, May 30 2017