Bekommt ihr auch manchmal den Hinweis von der Google Search Console: Probleme mit mobiler Ansicht – Inhalt breiter als Bildschirm? Dann schaut mal, ob es an zu langen Wörtern in den Überschriften liegt. Abhilfe schafft die hyphens-auto-Angabe in CSS. Es werden dann automatisch lange Wörter am Ende der Zeile mit Bindestrich getrennt. So aktiviert ihr die Silbentrennung:
/* hyphens */ -moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto;
Beispiel automatische Silbentrennung mit CSS
css: hyphens: auto
Reaktionsgeschwindigkeitskonstante und Nahrungsmittelunverträglichkeit sind sehr lange Wörter. Andere lange Wörter sind Lebensversicherungsgesellschaft, Steuervergünstigungsabbaugesetz und Bundesausbildungsförderungsgesetz.
css: hyphens: none
Mögliche Werte
none: Keine Silbentrennung
manual: Manuelle Silbentrennung (hab ich noch nie verwendet)
auto: Automatische Silbentrennung
Ausführliche Infos
https://developer.mozilla.org/de/docs/Web/CSS/hyphens
Infos zur Browserkompatibilität
https://developer.mozilla.org/de/docs/Web/CSS/hyphens#Browser_compatibility
Loading...
