CSS: Wrap Text UND Wort bei Bedarf zu brechen

Question

Wie kann ich ein div so einrichten, dass es Text umschließt und auch Wort wenn nötig brechen? Beispiele unten, wobei die Punkte die Breite des div zeigen ("zzzzzzz ..." ist alles ein Wort).

....................................
Hallo diese sind
Worte

....................................
zzzzzzzzzzzzzzzzzz
zzzzzz

Answer 1

Sie können Verwendung css word-wrap: break-word;

.wrap { 
 
    width: 50px; 
 
    word-wrap: break-word; 
 
    border: 1px solid red 
 
}

<div class="wrap">This is a mormal div wrapping and breaking words</div>

Answer 2

und wenn Sie möchten, dass ein Wort an einer bestimmten Position getrennt wird, wenn es für den Container zu lang ist, können Sie die ­ Einheit (Soft Bindestrich) verwenden. So ist die HTML

singledoubletriple­quadruplequintupleburger 

singledoubletriplequadruplequintupleburger 

auf dem Bildschirm bleibt, wenn es in einer Zeile passt, aber

singledoubletriple- 
quadruplequintupleburger 

werden, wenn die Linie kürzer ist