Wie verwende ich automatische CSS-Bindestriche mit `word-break: break-all`?
Ich benutzeword-break: break-all;
und möchte wissen, wie ich den browser automatisch einfügen lassen kannBindestriche, wie in einem demonstriertMDN-Beispiel.
div {
width: 80px;
height: 80px;
display: block;
overflow: hidden;
border: 1px solid red;
word-break: break-all;
hyphens: auto;
-ms-hyphens: auto;
-moz-hyphens: auto;
}
<div>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
So dass der Text so aussehen würde:
aaaaaaaa-
aaaaaaaa-
aaaaaaaa-
aaaaaaaa
Ich habe eineJSFiddle auch.
Dies muss in IE9 / IE10 funktionieren, aber es wäre schön, wenn es auch in Firefox und Chrome funktionieren würde.