CSSでURLや英単語がボックスからはみ出る現象の対策

コーディングをしているとdivなどのボックス要素からURLや英単語がはみ出して見栄えが悪くなることがあります。

その解決策をメモ。

word-wrapを指定

サイト全体に反映させたかったのでbodyに適用した。

body {
  word-wrap: break-word;
}

確認してみると折り返されている。

正社員でフリーランスな仕事を実現

フリーのエンジニアになって仕事を自由に選びたい！正社員並みの保証が欲しい！

という相反する要望をかなえてくれるのが【midworks】です。

雇われるだけの生活から脱出してみませんか？

おわりに

単語の途中で折り返されるというのはめったに無いことですが、表示の崩れはなんとなくそのサイトの信用度が落ちるのでなるべく避けたいですね。