Re: Page Layout Improvements

[hotpink]

@goalieman34

To remove the unwanted space between entries, you need to remove the 18px bottom margin on the .journal-entry element. To preserve the spacing between the dates, you need to preserve that same 18px in some way.

One way is to set a top-padding of 18px. Use padding rather than margin, because you want the background of the .journal-entry to be shown.

Change this

.journal-entry {
margin-bottom: 18px;
}

To

.journal-entry {
margin-bottom: 0;
padding-top: 18px;
}

The above code will give you a layout with the bottom-border flush against the date, while preserving the spacing.

However, I think it looks better if you split the spacing between the top and bottom, like so…

.journal-entry {
margin-bottom: 0;
padding-top: 9px;
padding-bottom: 9px;
}

Also I think “.journal-entry .title” could use a few pixels of adjustment. It’s a very minor change but I think it makes a big difference in quality.

.journal-entry .title {
padding-top: 2px;
}