@media screen unktioniert nicht

[funkyflow]

Hallo Erstmal ins Forum!

Ich habe ein Problem, vielleicht könnt ihr mir ja helfen.
Ich möchte, daß eine Webseite bei Anzeige auf dem Samrtphone eine kleinere Schrift hat, als auf dem Browsr.
Dazu habe ich folgenden Code in den css-styles (seperate datei) geschrieben:

@media screen and (max-width: 360px) {
p {color:red; font-size: 0.70rem;}
}

(rote schrift zusätzlich für den test, damit ich auch eindeutig merke ob es funktioniert)
für tesxtabsätze bei größeren anzeigemedien gilt dann diese angabe:

p {text-align:left; margin-top:15px; font-size: 1.10rem; font-family:Geneva, Arial, Helvetica, sans-serif; color:#2E3F4F;}

Nur leider wird auch auf dem Smartphone immer nur die große Standard-Schrift angegeben.
Die media-screen Anweisung wird einfach ignoriert.
Habt ihr eine Idee?
Kann es an der Kodierung der css-Datei liegen?

Danke im Voraus!

lg,
Floh

 

[Sempervivum]

Hallo Floh und willkommen im Forum!

Wenn das CSS in dieser Reihenfolge steht, kann die Mediaquery nicht funktionieren, weil das CSS durch das darunter, ohne Mediaquery, überschrieben wird.

 

[funkyflow]

wie geil!umgedreht, funktioniert! vielen lieben dank!
ich mache zum ersten mal mit responsivem layout rum, ist mir alles neu...
aber das mit der reihenfloge stand wirklich nirgendwo geschrieben!?

danke für die hilfe!

 

[Sempervivum]

Doch, das wird z. B. hier beschrieben:
https://wiki.selfhtml.org/wiki/CSS/Tutorials/Einstieg/Kaskade
Wenn Du dir das durch liest, wirst Du sehen, dass die Sache noch ein wenig komplizierter ist weil zusätzlich die Spezifität eine Rolle spielt. Wenn Du in responsives Layout einsteigen willst, kann es nicht schaden, dich damit vertraut zu machen.

 

[funkyflow]

ok ich mache grade hausaufgaben ;-)
das ist aber ja eine grundsätzliche css sache die sich in dem fall auf die mediaquery auswirkt, aber nix mediaquery-spezifisches ist, richtig?!
viele lieben dank jedenalls für die schnelle und starke unterstützung!

 

[Sempervivum]

Ja genau, das ist CSS allgemein und nicht spezifisch für Mediaqueries.