Ich habe eine Seite, die nicht externes CSS verwendet<style> Tags und in diesen<style> Tags ist die folgende Medienabfrage:

@media screen and (max-width:768px){
/* CSS */
}

Alles funktioniert einwandfrei in Firefox, dem CSS für 768px Breite und unter nur rendert, wenn es sollte. In IE9 wird das CSS in dieser Medienabfrage jedoch beim Laden gerendert, unabhängig von der Größe.

Wenn ich jedoch die Browsergröße ändere, wird sie nach dem Laden wie gewünscht als Desktop-Version gerendert. Im Grunde scheint das nicht-externe Stylesheet von IE9 das gesamte CSS zu rendern, unabhängig davon, ob es sich um eine Medienabfrage handelt, für die es nicht passt oder nicht, aber dann das richtige CSS zu rendern, wenn die Größe des Browsers selbst um einen Pixel geändert wird.

Weiß jemand genau, was damit los ist oder ob es eine schnelle Lösung gibt? Die einzige Lösung, die ich mir vorstellen konnte, bestand darin, das Problem zu umgehen, indem ich mein CSS neu anordnete und eine neue Medienabfrage hinzufügte, die ich vermeiden möchte, um den Code einfacher zu aktualisieren.