Hallo werte Selfgemeinde,
bei der aktuellen Entwicklung eines Layouts für ein Projekt, bin ich über folgendes Problem gestolpert:
Ich verwende Media Queries der Art
@media screen and (min-width: 20em) and (max-width: 29.9375em) { ... }
Bei Tests mit meinem Nokia Lumia 520 stellte ich zu meiner Überraschung fest, dass nicht die erwartete Rule matched, sondern stattdessen jeweils die, deren Breitenangabe mit der Display-Auflösung übereinstimmen.
Diese beträgt bei dem Lumia 480 x 800 Pixel, wohingegen die Viewportgöße lediglich 320 x 480 Pixel beträgt.
Eine Google Recherche ergab unter anderem den folgenden informativen Treffer:
Responsive Design in IE10 on Windows Phone 8
Entgegen dem letzten Update in dem Artikel (vom 15.10.2013) halte ich das "Problem" keineswegs für "gelöst". Denn egal ob mit oder ohne den Viewport Meta-Tag und/ oder irgendwelche '@-ms-viewport' Angaben, triggert der IE grundsätzlich MQs nach der Displaygröße.
Einzig unter Verwendung der angegebenen Javascript-Funktion triggert er die MQs nach der Viewportgröße.
Fragen:
1. Ist sonst schon wer über das "Problem" gestolpert?
2. Wenn ja, wie hast du es "gelöst"?
3. Hab' ich irgendetwas "falsch" verstanden, bzw. mache ich etwas falsch?
Gruß Gunther