Pro, Blog, Masonry Style, Post on the right

[ERES]

Hey guys,

please see the link in the secure note. The 4th blog-post is on the right but should be on the left. I know with an equal height of every blog-posts this would not happen but this is not the sense of the masonry style. Where is the problem?

Thank you!

[lely]

Hi @RSMG,

The 4th blog post is on the left when I check. Can you give us screenshot of what you are seeing and details of the browser?

[ERES]

See Secure Note

[friech]

Hi @RSMG,

Thank you for the screenshot, the masonry behaves like that because there are more space on the left and right than in the center. Try to remove one tag for your first and second article that will align things properly (just to test).

And right now it looks like that because you have an odd number of posts. Try adding one more and you’ll see it’s not that bad, so I would not really worry about that.

Cheers!

[ERES]

As I wrote in my first post I know that this is the problem. But an equal height of every blog-post is not the sense of a masonry style. If we read from left to right the blog posts should be displayed from left to right too. And your tip “try adding one more” is nonsense. That means I never should have an odd number of posts? Are your serious? That was the worst support answer ever.

[ruenel]

Hello @RSMG,

Please understand that the masonry script will try to arrange the items like bricks. As you can see, your titles and contents where not on the same heights. If you can can manage to limit the titles and content on the same lengths to have the same heights, then the items no be in order and not on a brick layout.

Perhaps, if you to make sure that the items display in order, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.x-iso-container-posts.cols-3 .entry-title {
    min-height: 130px;
}

.x-iso-container-posts.cols-3 .entry-content.excerpt {
    min-height: 160px;
}

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