見出しとかの日本語をいい感じの塊で自動改行するCSS - Qiita

先に結論 See the Pen いい感じに自動改行するやつ（完成形） by 松田美文 (@mifumi323) on CodePen. リサイズできるようにしたから横幅変えて挙動を確認してみてね。 ポイント 大きな塊単位で改行して、それで収まらなければ小さな塊で順次改行していくよ display: inline-block;のスタイルを当てたspanタグで囲った部分が一つの塊になるよ spanタグの入れ子でより細かい塊を作ってるよ スペース(特に全角スペース )はspan要素の端に来ないようにする必要があるよ overflow-wrap: anywhere;とword-break: normal;のスタイルの組み合わせで、最小の塊より幅が狭くなったときの改行を制御してるよ ここから下は、もうちょっと詳しく知りたいって人向けです。 前書き さて皆さん、映画『それいけ！アンパンマン ばいきん