Silbentrennung in CSS mit hyphens – Warum es manchmal nicht funktioniert
Die CSS-Eigenschaft hyphens ermöglicht die automatische Silbentrennung von Texten. In der Theorie sollte sie also problemlos funktionieren – doch in der Praxis kann es vorkommen, dass die Trennung einfach nicht greift, egal welche Werte man im CSS setzt.
Der entscheidende Grund
Der Fehler liegt meist nicht an der CSS-Definition, sondern an einer oft übersehenen Voraussetzung: Silbentrennung ist sprachabhängig.
Damit ein Browser Wörter korrekt trennen kann, müssen zwei Bedingungen erfüllt sein:
- Das lang-Attribut in HTML muss die Sprache des Inhalts angeben.
- Ein passendes Trennungswörterbuch muss für diese Sprache im Browser verfügbar sein.
Ohne das lang-Attribut ignoriert der Browser die hyphens-Eigenschaft – egal, was im CSS steht.
Fazit
Wenn die Silbentrennung nicht funktioniert, überprüfe zuerst, ob das lang-Attribut korrekt gesetzt ist. Ohne diese Angabe bleibt die hyphens-Eigenschaft wirkungslos – ganz egal, was im CSS definiert ist.
