英単語の途中の改行の処理を指定する
CSSの書き方
word-wrap:値 ;
|
|||||||||||||||||||||||||||||||||||||||||
解説
文章中の途中で英単語の改行をするかどうかを指定するスタイルシートです。IE独自のプロパティですが、Safariも対応しています。ただし、一部の値で両ブラウザの挙動が異なります。
break-wordの場合
「word-wrap」プロパティの値に「break-word」を指定した場合の挙動ですが、両ブラウザとも要素内に英単語が収まりきらない場合は単語の途中で改行されます。
normalの場合
一方、「word-wrap」プロパティの値に「normal」を指定した場合は、InternetExplorerでは要素内に英単語が収まりきらない場合は改行できる部分まで要素の幅が伸びて、単語と単語の間で改行されます。
また、Safariでは、要素に英単語が収まりきらない場合でも、要素は拡大せず、収まらない部分は要素からはみ出して表示されます。（overflowプロパティに依存）
CSS/HTMLサンプル
p { word-wrap:break-word; }
段落要素の英単語は途中で改行するよう指定 サンプル
