改行というか折り返しの処理
urlなどでなが～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～い文字列を表示させようとしたとき、
こんなふうに改行されず親のboxを突き抜けてしまうとき使うやつ
英単語などは入りきらないとき、単語の途中で改行されないのはわかってたけど
狭いスペースに長い英数文字列を書くことなかったので意識してなかった
2つのCSSプロパティ
- word-break
- word-wrap/overflow-wrap
word-wrap/overflow-wrapは前者がcss3から後者にかわるため
2つの違い
実はこれらの折り返し処理は若干違いがあるらしい
それぞれの値と処理の内容
word-break
p{
word-break : break-all;
}
一切の禁則処理が解除される
ガンガン折り返す or とか 、 とかも気にせずとにかく折り返す
word-wrap/overflow-wrap
p{
word-wrap : break-word;
overflow-wrap : break-word;
}
可能な限り禁則処理が保持される
欧文などはこれが推奨されるみたい
word-break : break-all;
古いブラウザとか考えるのめんどいので、とくに問題なければコレ