私はInternet Explorerにワードラップスタイルがあることを知っていますが、divのテキストにそうするクロスブラウザー方式があるかどうかを知りたいと思います。divに長い単語をワードラップする方法はありますか?
好ましくはCSSですがJavaScriptのスニペットもうまくいきます。
編集:はい、長い文字列を参照して、歓声の人々!
私はInternet Explorerにワードラップスタイルがあることを知っていますが、divのテキストにそうするクロスブラウザー方式があるかどうかを知りたいと思います。divに長い単語をワードラップする方法はありますか?
好ましくはCSSですがJavaScriptのスニペットもうまくいきます。
編集:はい、長い文字列を参照して、歓声の人々!
、ラザフォードは、切れ目のない破るために設計されたIEのためのワードラップの彼の使用により推測切れ目のないテキストを(、ラップするクロスブラウザ方法を探しています文字列)。
/* Source: http://snipplr.com/view/10979/css-cross-browser-word-wrap */
.wordwrap {
white-space: pre-wrap; /* CSS3 */
white-space: -moz-pre-wrap; /* Firefox */
white-space: -pre-wrap; /* Opera <7 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* IE */
}
私はこのクラスをちょっと使ったことがあり、魅力的です。 (注:私はFireFoxとIEでのみテストしました)
古い投稿ですが、IEがquirksモードのときに空白を表示するようには表示されません。 – Jeremy
が動作していません..... –
私はFirefox 24.6.0を使用しています。実際に働くのは 'word-wrap:break-word'です。 – user545424
デイビッドが言及しているように、DIVは、デフォルトではになります。
あなたは私がやることは、文字列、サーバー側を処理し、空のスパンを挿入され、スペースを含まないテキストの本当に長い文字列を参照している場合:
thisIsAreallyLongStringThatIWantTo<span></span>BreakToFitInsideAGivenSpace
フォントサイズに問題があるとして、それは正確ではありませんですなど。 spanオプションは、コンテナのサイズが可変であれば機能します。固定幅のコンテナであれば、改行を挿入するだけです。
IE9以上で動作していません... –
@TomHertこれは本当に奇妙です。しかし、よく、IE。それは決してうまくいかない。つまり、これは5年前に掲載されました。 CSS3には、IEが対応できるワードラップオプションがいくつか追加されています。https://developer.mozilla.org/en-US/docs/Web/CSS/word-wrap –
ええ、私はちょうどこのシンプルさにショックを受けました私が試してみたソリューション:) –
divの幅をピクセル、パーセンテージ、emのいずれで指定しても問題はありません。その時点でdivはその幅のままで、テキストはdiv内で自動的に折り返されます。元のコメントを読む
10pxの幅を設定してから、10pxより長い単語を使用してください –
Aaron Bennetのソリューションは私にとって完璧に機能していますが、コードからこの行を削除する必要がありました - >white-space: -pre-wrap;
beacauseコードの作業は以下の通りです:
.wordwrap {
white-space: pre-wrap; /* CSS3 */
white-space: -moz-pre-wrap; /* Firefox */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* IE */
}
前の回答のほとんどは、Firefox 38.0.5で私のために動作しませんでした非常に
をお願いします。これは...
<div style='padding: 3px; width: 130px; word-break: break-all; word-wrap: break-word;'>
// Content goes here
</div>
ドキュメントんでした:
ワードラップはデフォルトで行われます。 *別の言葉ではないときにラッピングすることを意味しますか? – Quentin