メールアドレスやURL表示する時に、word-wrapが効かずうまく改行されず枠からはみ出て表示されてしまうことがあります。
レスポンシブサイトでスマホサイズにした時に文字がはみ出したり、テーブルの枠に収まりきらずレイアウトが崩れたりしたときの対処法を紹介します。
word-break : break-allを指定する
word-wrapが効かないときはCSSでword-break : break-all;を指定してみるとうまくいく場合があります。
css
p{
word-break:break-all;
}break-allはどんな場合でも強制的に改行します。
どうしても改行が必要な場合はword-break : break-all;を使いましょう。
