Verhindern, dass lange Wörter aus Div ohne CSS-Break-Wort fließen

Question

Ich habe ein Div und alle langen Wörter (ohne Leerzeichen) fließen außerhalb der div.

Bitte markieren Sie die Frage nicht als Duplikat von How to prevent long text from flowing out of a container oder Long words are flowing out of the box - How to prevent?, wobei das Problem durch Verwendung von word-wrap: break-word; gelöst wird.

Der Nachteil von word-wrap: break-word; ist, dass es auch kurze Wörter bricht, die am Rand des div sind, in einer Weise, die den Fluss des Textes unterbricht. Ich möchte, dass kurze Worte so bleiben wie sie sind und nur die langen Worte brechen. Ist es möglich, dies zu implementieren? Wie gehen andere Websites damit um?

Answer 1

es bricht auch kurze Wörter, die

am Rand des div sind, dass das nicht wahr ist ... word-wrap: break-word; das nicht tun sollte.
Vielleicht verwirren Sie dies mit der word-break: break-all; Eigenschaft (die nicht in allen Browsern funktioniert).

Sehen Sie diese jsfiddle für einen Vergleich: http://jsfiddle.net/Snu8B/3/

Für firefox Sie die hyphens Eigenschaft versuchen könnte.

Answer 2

Wenn Sie bereit zu „verstecken“ sind die Worte, die Sie mit Überlauf spielen können: versteckt

.mydiv { 
    height : youchoose; 
    width : youchoose; 
    overflow: hidden; 
} 

Ansonsten:

word-wrap : normal|break-word; 
normal : Break words only at allowed break points 
break-word: Allows unbreakable words to be broken 

word-break: normal|break-all|hyphenate; 
normal : Breaks non-CJK scripts according to their own rules 
break-all : Lines may break between any two characters for non-CJK scripts 
hyphenate : Words may be broken at an appropriate hyphenation point