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

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

その解決策をメモ。

word-wrapを指定

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

body {
  word-wrap: break-word;
}

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

フリーランス向けの高額案件紹介

仕事を請け負っても、単価が安くて売上が伸びず複数案件をこなさなければならない。

ということありませんか？

エンジニアファクトリーは高単価案件を持ち、エンド直請けの仕組みにより高額案件を実現しています。

無料で登録できますので、どのような高額案件があるか確認してみてください。

無料で高額案件を探す

おわりに

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