Viewport-Unit-Schriftgröße und Zoomfehler: Welche Browser sind betroffen?
Es scheint, dass Desktop IE10 Text, dessen Schriftgröße in Ansichtsfenster-Einheiten festgelegt ist, nicht korrekt skaliert, wenn die Zoomstufe nicht auf 100% festgelegt ist. Ich versuche herauszufinden, welche IE-Versionen (und möglicherweise andere Browser) davon betroffen sind. Bitte probieren Sie dieses Beispiel in Ihrem Browser aus und melden Sie Ihre Ergebnisse:
<!DOCTYPE HTML>
<HTML>
<HEAD>
<META HTTP-EQUIV="content-type" CONTENT="text/html; charset=ISO-8859-1">
<META NAME="viewport" CONTENT="width=device-width, initial-scale=1.0">
<STYLE TYPE="text/css">
DIV:first-of-type {width: 32px; height: 32px; background-color: blue;}
DIV:last-of-type {width: 3.125vw; height: 3.12vw; background-color: red;}
P:first-of-type {font-size: 32px;}
P {font-size: 3.125vw;}
P:last-of-type {font-size: 16px;}
@-webkit-viewport {width: device-width; zoom: 1.0;}
@-moz-viewport {width: device-width; zoom: 1.0;}
@-ms-viewport {width: device-width; zoom: 1.0;}
@-o-viewport {width: device-width; zoom: 1.0;}
@viewport {width: device-width; zoom: 1.0;}
</STYLE>
</HEAD>
<BODY>
<DIV></DIV>
<P>font-size: 32px</P>
<DIV></DIV>
<P>font-size: 3.12vw</P>
<P>Resize the window to see the expected behaviour.<BR>
Zoom in/out to see IE's erratic behaviour:<BR>
the DIV adapts to the new viewport width,<BR>
but the font size doesn't.</P>
</BODY>
</HTML>