CSS: Text an Bildschirm anpassen?

[Matthias Scharwies]

Servus!

Hallo liebe SelfHTML-Community!

Herzlich Willkommen!

Und zwar soll sich die <h1>-Überschrift an den Bildschirm anpassen, da die Überschrift derzeit ohne zu zoomen kaum leserlich ist.

Deine Metaangabe ist falsch!

So wär's richtig:

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

Dann würde ich für die media queries Werte in der relativen Schriftgröße em angeben. Als Größe verwende bitte min-width der Seite und nicht min-device-width des Geräts:

@media only screen and (min-width: 20em)  {
	
	h1 {
	  font-size: 3em;
	}
}

@media only screen and (min-width: 35em)  {
	
	h1 {
	  font-size: 2.5em;
	}
}

PS: Im von dir gezeigten Code fehlt eine schließende geschweifte Klammer.

Herzliche Grüße

Matthias Scharwies