ブログ記事とかでURLのような長い英語のテキストがある場合、スマホで表示させると
コンテンツを突き破って、表示される。ただ突き破るだけならまだしも、スクロールできてしまうから、スマホでスクロールすると、そのコンテンツだけカクカクしてしまう。
そんな時はbodyにword-wrapプロパティの「break-word」を指定しおけば、英語も途中で改行される。
スマホ対応させたページなら、ほぼ必須かも。
word-wrap:break-word;
ただし、table内はword-wrap:break-word;が効かないので、以下のコード
table { table-layout:fixed; }
テーブルが均等に表示されるので、table項目によって文字数の差がある場合は少々バランスが悪くなる。
word-break:break-all;とほぼ同じ効果を得たいならこっちのほうが良いかも。
table { word-break:break-all; }