[Support request] Masonry not working properly until window resize

[Peter]

Hi Tom & GP,

Im having a problem with my masonry layout on front page blog and archive pages. The masonry grid doesnt display correctly (1 column showing only, instead of 2) on initial page load in certain window widths. As soon as the window is resized the masonry snaps in correctly.

You can replicate this on my website with window width ~800px in Chrome (Im using Version 67.0.3396.99 (Official Build) in Windows 10).

Please advise

[Tom]

Hi Peter,

That’s strange. Is this only happening at 800px? I’ll do some digging 🙂

[Peter]

That’s strange. Is this only happening at 800px? I’ll do some digging 🙂

Its around that area yes. Seems to be when the margins go out all the way to the side and before mobile. On mobile ive turned the masonry off.

Maybe because Ive added some styling (like box-shadow) to the articles?

[Tom]

Does it still happen if you remove the box shadow?

I just tried replicating it using GPP 1.7-beta.1 and can’t.

Let me know 🙂

[Peter]

Hi Tom,

removing box-shadow and other styling from article > .inside-article doesnt helt, still same problem. I also tried to put stuff like width: 90%, margin: -5px but no go.

Best Regards,

[Tom]

Can you try GPP 1.7-beta.2? I just want to make sure it hasn’t already been fixed: https://docs.generatepress.com/article/beta-testing/

Let me know 🙂

[Peter]

Sure, but how do I opt in?

[Tom]

Ah, you’ll need to update to GPP 1.6.2 first in order for that option to show up. You should see the update available in the Plugins area.

Updating to 1.6.2 might fix it actually.

[Peter]

Hi Tom,

Fixed with 1.6.2, thanks!

[Tom]

Awesome! 🙂

[Author]

Posts