Hallo,
Mein geschätzter Kollege hat mir grad ins Ohr geflüstert, beim UC-Browser sind es 19px.
Ich bin nicht gut in Mathe, aber: Solange es nicht signifikant weniger oder mehr ist, als ich annehme, greifen die stacked MQs korrekt.
Prämisse: Browser runden em-Werte in MQs kaufmännisch auf volle px, bevor sie angewendet werden.
Angenommen ich lasse die MQ bei x + 1/16em anfangen:
@media screen and … and (max-width: 50em)
@media screen and (min-width: 50.0625em) and …
Bei den genannten 19px wären 1/16em berechnete 1.1875px. Abgerundet 1px. Also würden die MQs funktionieren, es gäbe keinen »Zwischenraum«, in dem keine der beiden MQs greift.
Wenn ich hingegen eine Basis-Schriftgröße von 8px annehme:
1/16em * 8px = 0.5px
Wird aufgerundet auf 1px. *Darunter* (7px) würde es kritisch werden, dann würde abgerundet.
Anders herum: Wenn ich hingegen eine Basis-Schriftgröße von 24px hätte:
1/16em * 24px = 1.5px
Wird aufgerundet auf 2px. Damit gäbe es eine Viewport-Breite, in dem keine der beiden MQs greift.
Sprich, wenn ich von 16px ausgehe, habe ich eine Toleranz von 8px - 23px. (Man korrigiere mich.)
Das ist, behaupte ich einmal, in der Praxis genug, um Fehler zu vermeiden. Es kommt noch hinzu, dass der Viewport genau diese Pixelbreite haben muss, um den Fehler auszulösen. Das ist alles möglich, aber äußerst unwahrscheinlich. Die Wahrscheinlichkeit, dass ich nach dem Schreiben dieses Postings aus heiterem Himmel tot umfalle, ist vermutlich höher. ;)
Disclaimer:
Die Prämisse kann natürlich falsch sein, z.B. falls Sub-Pixel-Rendering angewandt wird, dann sind alle Schlüsse hinfällig.
Ich habe es nicht in Browsern getestet, das ist alles bloß theoretisch.
Mathias