ページにテキストを含む固定幅のdivがあります。文字の長い文字列を入力すると、オーバーフローします。オーバーフローを非表示にしたくない新しい行にオーバーフローを表示したい、以下を参照:
<div id="textbox" style="width:400px; height:200px;">
dfssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssfddddddddddddddddddddddsdffffffffffffffffsdffffffffffffffffdfssssssssssssdf
</div>
とにかくオーバーフローを無効にし、オーバーフローしたテキストを新しい行に配置する方法はありますか? Twitterはこのようなことをしますが、CSSではJavascriptを使用している可能性があります。
誰でもこれを助けることができますか?
Word-wrap: break-Word
しかし、それはCSS3です- http://www.css3.com/css-Word-wrap/ 。
追加するだけ
white-space: initial;
テキストに対して、行テキストは次の行に自動的に挿入されます。
<wbr>
タグ -他の人が提案したWord-wrap
プロパティほどエレガントではありませんが、すべての主要なブラウザ(IEを読む)がCSS3を実装するまでは有効なソリューションです。
さて、長い切れ目のない文字列に1つ以上の「ソフトハイフン」(­
)を付けることができます。古いIEバージョンがそれを正しく処理しているとは思いませんが、想定することは、必要な場合に使用できる許容されるWordブレークについてブラウザに伝えることです。
さて、これらのキャラクターをどこに詰め込むかを正確にどのように選びますか?それは実際の文字列とそれが何を意味するかにかかっていると思います。