空のpタグに高さをつけたい(pタグを入れても改行されない)

pタグのmarginもpaddingも上下が0だった場合、空のpタグには高さが無くなってしまいます。pタグだけで空行を作りたい場合、中身が空のpタグにも高さを持たせたいことがあります。

解決法

1文字分のmin-heightを持たせる。

p {
  min-height:1em;
}

備考

pタグのブラウザのデフォルトは、margin:1em 0 1em 0; ですが、marginとpaddingの値は全て0にしておきたく、その上でpタグで空行を作りたかったのですが、この状態だと、pタグの高さが0になってしまい、空行になりませんでした。

上記方法で、文字が全く入っていない場合だけ、最低1文字分の高さを持たせるようにすることで解決できました。

この投稿は役に立ちましたか? 役に立った 4人中4人がこの投稿は役に立ったと言っています。