@media-Regel definieren

[Holger]

Hallo,
in der Option "Bildschirmgröße testen" im Firefox wird für das Ipad der Wert 768X1024 angezeigt. Ab etwa dieser Viewportbreite möchte ich eine neue @media-Regel definieren.

Ist dann die Angabe "@media screen and (min-width: 768px)" korrekt? Ich frage deshalb, weil doch immer öfter empfohlen wird, em oder rem zu verwenden.

[Rolf B]

Hallo Holger,

du solltest da tatsächlich besser 45em oder so hinschreiben. Wenn Du einen Anwender hast, der den Text auf seinem Gerät stark gezoomt hat, kommst Du ggf. auch bei 1200px in die Lage, dass dein Layout nicht mehr passt.

Faustregel: 1em=16px - aber nur, wenn die Default-Fonts des Browsers verwendet werden. Wenn Du eine kleinere Schrift für den Body setzt, ist ein 1em weniger.

Stell was ein, variiere die Größe des Browserfensters auf dem Desktop, und guck, welcher Mediabreak gut aussieht. Häng Dich nicht an konkrete Displaygrößen.

Rolf