CSSで見出し等作成時、インラインブロック要素の後で改行させたい

ブログの目次(h2タグ,h3タグ, h4タグ)をインラインブロック要素でデザインしたい場合があります。
そうすると幅を指定しない場合、異なる階層の目次が改行されず1行に続いてしまいます。

解決策

そんな時は、「display: inline-block; 」を、「display:table; 」に変えると改行できました。

「display:table; 」は、インラインブロックで中央に寄せたいときにも使えました。

display:tableとは

table要素のような表示となる

HTMLクイックリファレンスより引用

タイトルとURLをコピーしました