最終更新:2024-03-18 (月) 13:16:45 (40d)  

overflow-wrap
Top / overflow-wrap

ブラウザーが分割できない文字列の途中で改行を入れるかどうかの設定

https://developer.mozilla.org/ja/docs/Web/CSS/overflow-wrap

normal

anywhere

  • あふれることを避けるために、行内にその他の分割可能な位置がない場合、その他の分割できない文字列 — 長い単語や URL — が任意の場所で分割されることがあります。分割位置にハイフン文字は挿入されません。
  • コンテンツの最小固有寸法を計算する時には、単語分割によって導入された折り返し可能位置が考慮されます。
    • width: に min-content? が指定された場合、横幅が最も小さくなるように自動改行する

break-word

  • anywhere の値と同様に、行内にその他の分割可能な位置がない場合、通常は分割可能でない単語が任意の場所で分割されますが、コンテンツの最小固有寸法を計算する時に、単語分割によって導入された折り返し可能位置が考慮されません。

メモ

  • word-breakとは対照的に、overflow-wrapは単語全体があふれずに行内に配置できない場合にのみ、改行を生成します。

関連

参考