はてなブログ:記事一覧ページの間隔の調整
どういうわけか記事一覧のページが酔っ払っていたので直したのですが、
記事同士の間隔がやたら狭かったので、少し広めて見やすくします。
↓初期状態。タイトル、記事本文の下が詰まっています。
記事一覧のタイトル部分は.archive-entry-headerが含まれているようです。
ここにmarginを入れれば解決します。
記事本文については、.archive-entryを広げればOKです。
.archive-entry-headerと.archive-entryを調整すると、このようになります。
.archive-entryではなく、.archive-entry-bodyのpadding等を調整する方法もあります。
ただし、短い文章の記事だと、このように詰まってしまいます。
これはサムネイルの.entry-thumbクラスにfloat: left;がかかっており、
右側の余白が考慮されていないものだからと思われます。
そこで、.archive-entry-body:afterを追加し、
clearfixと同じ処理を記述してみます。
うまくいけました。
※追記:空けたあとの方がむしろ見づらくなってますが、調整中ということで多めに見てください…