塊と塊の隙間

Webページを作っていると、大抵の場合似たような内容のブロック要素が縦に並ぶことがよくある。ブログの記事なんかが典型例。その縦に並ぶ要素を、ある程度の間隔を空けてならべる一番スマートな方法はなんなんだろう、ということで色々と悩んでいる。

間に空白のブロック要素を挟む

<div style="height: 20px; clear: both;">&nbsp;</div>

みたいなものを間に入れることで、間隔をあける。簡単だけど、非本質的なタグが入り込むのであまり気持ちよくはない。

要素の(上|下|上と下)にマージンを設定する

これが割と妥当なのかもしれないが、2カラムになっているページレイアウトの場合、隣のカラムとの線のズレがあったりすると気持ち悪い。一貫したマージン設定のポリシーを定めておけばスマートにいくかもしれない。