Windows screen scale messing up css sizes
You might try to add a viewport meta tag in the head section of your index.html:
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
In CSS you can use (not standard yet):
// refers to 125%
@media (-webkit-min-device-pixel-ratio: 1.25) { ... }
and
@media (-webkit-max-device-pixel-ratio: 1.25) { ... }
In Javascript you can use:
window.devicePixelRatio > 1.25 ? doA() : doB()
Reference:
-webkit-device-pixel-ratio - CSS: Cascading Style Sheets | MDN
Window.devicePixelRatio - Web API インターフェイス | MDN