2010/10/30初出
2010/10/30改訂

●連続する半角英数字が改行されない

URLなどの半角英数字が連続する場合、文字が自動的に改行されず、右に突き抜けてレイアウトが崩れる、といった事が起こり得る。

Firefox

エリアを突き抜けて文字列が表示されるが、その他のレイアウトに影響はない。

IE6

文字列の長さに合わせてエリアが伸びてしまい、サイドエリアが下に回り込む。

◆回避策

• CSSに word-break:break-all を指定して右端で改行させる（IE、Safari、Chrome）。
• CSSに word-wrap: break-word を指定して右端で改行させる（IE、Safari、Chromeほか、Firefoxにも対応）。
  ※ともにボックス幅の広がりを防げるが、IEの場合、単語区切りにならず英数字が読みづらくなる。
• はみ出し部分をCSSの overflow:hidden で切り落とす。