Log in Sign up

Post spacing in the Blog template

Hey, what would be the easiest way to condense the space between posts in the Blog template? When a post is short, the space between that and the next post looks large.


3 years ago, 5 replies   Edit question

Hello, you will want to follow these steps:

  1. Fork an editable copy of the Blog template if you haven't already.
  2. Press 'Edit' to open up the template editor for your fork of the Blog template.
  3. Navigate to the source code for your fork of the Blog template and edit line 68 in the style.css file:
.entry {margin: 0 0 192px}

If you reduce the bottom margin from 192px to say 48px, you should dramatically reduce the spacing between posts.

Answered 3 years ago · Edit answer

Thanks! I went with 120px and it looks great.

Answered 3 years ago · Edit answer

Related: what would be the easiest way to expand the margins just a bit and reduce the main wrapper?

Answered 3 years ago · Edit answer

You will want to edit the properties in lines 66-68 to tweak the horizontal margins and width of the main wrapper:

.main {max-width: 60%;min-width: 720px}
.container {max-width: 1000px;margin-top: 82px} /* 66px header height + 16 */
.entry {margin: 0 0 192px}
Answered 3 years ago · Edit answer

Thanks, I didn't go crazy, in order not to mess up being able to hang things in the side margin, but it's now a little more compact.

Answered 3 years ago · Edit answer