UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.62 Safari/537.36

Example URL:
http://jsbin.com/yakuvofasa/edit?html,css,output

Steps to reproduce the problem:
1. Open http://jsbin.com/yakuvofasa/edit?html,css,output
2. Make sure browser zoom is reset to 100%.
2. In Windows, open Display settings
3. If you have multiple monitors, select the one containing Chrome
4. Inside the Display settings dialog, there is a magnification option. It is called "Change the size of text, apps, and other items". This setting is mostly used for high-resolution screens. (This is not to be confused with the Magnifier app of windows or the browser zoom!)
5. Move the slider and observe the alignment of the two divs in Chrome. The divs are properly aligned for 100% and 200%, but they are misaligned for 125%, 150%, 175% and 225%.
6. Optional: If you have multiple monitors, set one to 100% and the other one to 125%, 150% or 175%. Move the Chrome window from one monitor to the other to see how the alignment of the divs changes.

What is the expected behavior?

What went wrong?
The divs are aligned differently. They are not at the same vertical position, but they should be, irregardless of the magnification setting.

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: 67.0.3396.62  Channel: stable
OS Version: 10.0
Flash Version: 

Doesn't occur with Firefox or IE11.
 

Deleted: MisalignedDivs.png 14.8 KB

	MisalignedDivs.png 14.8 KB View Download