Bestimmte Silbentrennung bevorzugen/ Trennung bevorzugen / Umbruch bevorzugen

[Rolf B]

Hallo Rotando,

ich weiß nicht ob das die eleganteste Lösung ist, aber was in meinem Experiment funktioniert ist dies:

<p><span>Anmeldung</span> <span>Zugangssystem:</span></p>

mit diesem CSS:

p { text-align: center; }
p span { display: inline-block; }

Durch display:inline-block verteilt der Browser zuerst die span Elemente auf die verfügbaren Zeilen, und nur wenn ein span nicht passt. wird innerhalb des span umgebrochen. Der span-Default display:inline bewirkt, dass zuerst die Silbentrennung aktiv wird.

Ein hyphen:auto im span hat bei mir nicht funktioniert, trotz lang="de" Angabe, keine Ahnung ob ich zu dumm bin oder Chrome. Aber mit ­ hat es gepasst.

Wenn Du mehr Worte hast und erreichen willst, dass die Worte ungefähr gleichverteilt auf die Zeilen verteilt werden, dann denke ich, dass Du da mit JavaScript nachhelfen musst. Es sei denn, Gunnar packt jetzt wieder irgendeine obskure CSS Eigenschaft aus 😉

Rolf