Main blog page spacing issue

[chrisware24]

Hello

My main blog page is set to three columns, masonry and with a full width layout. The issue I am having is that the posts are a bit scattered on the page. I would like equal white space around all of them and a uniform grid like look on the page with three posts across and properly spaced posts going down. What can I do to fix this?

Scroll down on this page. You can see that it starts out nicely, then by the bottom there is only one post all by itself.

BLOG • Chris Ware Photography - DP, Cinematographer

thanks!

[ruenel]

Hello Chris,

Thanks for writing in!

Your blog is a bit of a mess because the post titles does not have the same height and also you image. To resolve this, please do this two things:

• Please go to your Jetpack settings and disable the Site Accelerator (Formerly known as Photon module). This module controls the image and it is serving a cache version which will give you some more issues later on.
• And then please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.x-iso-container-posts .entry-title {
    min-height: 50px;
}

.x-iso-container-posts .entry-thumb img {
    width: auto !important;
    max-height: 390px !important;
}

We would love to know if this has worked for you. Thank you.

[chrisware24]

Hi

Thanks for helping. Unfortunately it didnt solve the issue. I still have random white space around the posts on the main page. What else should I try? Huge thanks!

[lely]

Hello Chris,

There’s a conflict with masonry layout calculation on initial load. I have checked and notice that when the page was resize, it calculates correctly. See this: https://screencast-o-matic.com/watch/cqiU2JOktn. Let’s find where’s that conflict is coming from. First, let’s try a general troubleshooting step. You could try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Let us know how it goes!