DIVで長い単語の強制行折り返しを実装するにはどうすればよいですか?

Question

わかりました、これは本当に混乱します。次のような

内にコンテンツがあります:

<div style="background-color: green; width: 200px; height: 300px;">

Thisisatest.Thisisatest.Thisisatest.Thisisatest.Thisisatest.Thisisatest.

</div>

ただし、「単語」が長すぎるため、(予想通り) コンテンツが

からオーバーフローします。

すべてを適合させるために必要な場合にブラウザに単語を「分割」させるにはどうすればよいですか?

Answer 1

ブラウザの互換性がわかりません

リーリー

<wbr> タグ

を使用することもできます。

Answer 2

使用ワードラップ:ブレイクワード;

これは IE6 でも動作しますが、これは嬉しい驚きです。

---

word-wrap:break-word は、overflow-wrap:break-word; に置き換えられ、最新のすべてのブラウザで動作します。 IE は古いブラウザであるため、非推奨の非標準の word-wrap に常に依存します。

word-wrap を使用する現在のケースは、正規の overflow-wrap のエイリアスであるため、引き続き正常に機能します。