[gelöst] Media Queries funktionieren nur mit Firefox

[yronx]

Hallo zusammen

Ich habe ein Problem mit dem Einsatz von Media Queries auf folgender Website: http://gvluesseltal.ch/index.php.

Ich verwende theme+ und zur normalen style.css habe ich zwei zusätzliche CSS-Dateien im Einsatz.

Die erste fängt mit folgendem Code an:

@media screen and (max-width : 899px)

Die zweite CSS-Datei fängt wie folgt an:

@media screen and (min-width : 900px) and (max-width : 1185px)

Im Head steht folgender HTML-TAG:

<meta content="width=device-width, initial-scale=1.0" name="viewport">

Im Firefox funktionieren die Anweisungen einwandfrei. Bei allen anderen Browsern werden die zusätzlichen, mit media queries definierten, CSS-Dateien nicht umgesetzt.

An was kann das liegen? Ich verwende übrigens IE, Opera, Chrome und Safari in den neusten Versionen.

Besten Dank für eure Hilfestellung bereits im Voraus.

[BugBuster]

Teste mal, ändere die Reihenfolge, von der größten zur kleinsten Breite. also erst die zweite dann die erste.

[yronx]

Hallo BugBuster

Besten Dank für deinen Hinweis. Dies war aber nicht das Problem. Dank deinem Hinweis ist mir aber die Lösung förmlich ins Auge gesprungen.
Ich hatte in den Eigentschaften der zusätzlichen CSS-Dateien jeweils den Medientype auf "screen" gesetzt. Dies ist offenbar, wenn man media queries verwendet, überflüssig und führt sogar zur Nichtdarstellung.

Nochmals Danke!