molily: font-size soll varieren, je nach Browsergrösse

Beitrag lesen

Hallo,

du kannst mit der Schriftgrößen-Einheit em bzw. rem (Browserunterstützung) arbeiten und für das Wurzelelement (html) eine feste px-Größe angeben. In Media-Queries änderst du den font-size-Wert von html und damit skalieren sich alle Schriften, deren Größe in (r)em angegeben ist.

Die vorgeschlagenen Einheiten vw/vh erlauben stufenlose Skalierung relativ zur Viewport-Höhe/Breite, werden aber von weniger Browsern unterstützt.

Wobei beide Lösungen im IE erst ab Version 9 funktionieren. In beiden Fällen muss man sich über einen Fallback Gedanken machen. Bei Media-Queries ist das das übliche Problem, aber nur wenn man Media-Queries so einsetzt, das die Version für kleine Viewports der Standard ist, also ohne @media definiert wird (oft als »Mobile First« bezeichnet). Bei vw/vh ist der Fallback ein vorher definierter font-size-Wert in em, px oder einer anderen passenden Einheit.

Mathias