Navigation
Archive / Renew blog masonry isn't aligning on first load
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • August 30, 2016 at 5:44 am #1153130
    owenb
    Participant

    Hi, my blog is here: http://owenbillcliffe.co.uk/blog

    Recently I’ve noticed that on first load of the page in Chrome, there is a large gap between rows. If I adjust the window size by even one pixel, everything shifts to line up. Any idea why?

    Cheers!
    Owen

    August 30, 2016 at 7:14 am #1153218
    Paul R
    Moderator

    Hi Owen,

    Thanks for writing in!

    I can’t seem to replicate the issue on my end.

    See Video – http://screencast.com/t/v8JDPtI3n

    Can you provide us a video showing how it is in your end.

    Thanks

    August 30, 2016 at 7:22 am #1153230
    owenb
    Participant

    Hi!

    Actually, you have replicated it just fine! 😉 Try adjusting the browser window size – not reloading the window – and you’ll see each row in the masonry slide up to fill that large gap between each row.

    August 30, 2016 at 8:07 am #1153275
    Joao
    Moderator

    Hi Owen,

    Would you mind providing a screenshot of you are referring to?

    Thanks

    Joao

    August 30, 2016 at 8:09 am #1153277
    owenb
    Participant

    First load, and then after adjusting browser window size.

    The gap shouldn’t be there – it should look like it does after window adjustment when the page is first loaded. Hope this helps – cheers!

    August 30, 2016 at 8:13 am #1153286
    owenb
    Participant

    Not sure if these are uploading.

    First load:

    August 30, 2016 at 8:14 am #1153288
    owenb
    Participant

    After adjusting browser window size:

    August 30, 2016 at 9:05 am #1153378
    Christian
    Moderator

    Please update Cornerstone first then check again. If the issue persists, please give us WP Admin access.

    Thanks.

    August 30, 2016 at 9:12 am #1153386
    owenb
    Participant
    This reply has been marked as private.
    August 30, 2016 at 10:23 am #1153513
    Christian
    Moderator

    Please backup your site and then remove custom CSS, Javascript and additional functions in your functions.php. And, deactivate all third party plugins for a moment while we investigate.

    Thanks.

    August 30, 2016 at 11:26 am #1153615
    owenb
    Participant

    Hang on – bit of an oops… As my site is currently being migrated to a new host and the new nameserver records haven’t yet propagated, but I’d switched my local hosts file to show the new site and had forgotten to switch back, the login I gave you probably won’t be working… Right now you’re probably looking at the site at the old host, and the site is actually ready to go at the new host as soon as the NS records switch.

    August 30, 2016 at 11:46 am #1153639
    Joao
    Moderator

    Hi Owen,

    Let us know when you are ready so we can help 🙂

    Joao

    August 31, 2016 at 5:44 am #1154874
    owenb
    Participant

    Solved it! Narrowed the culprit down to the WP Rocket plugin. Seems LazyLoad affects masonry layouts, it’s a known issue. But, they have an option to turn Lazyload off on individual pages so I disabled it on my blog page and problem solved! 😀

    August 31, 2016 at 6:46 am #1154959
    Christian
    Moderator

    Glad you’ve sorted it out and thanks for sharing.

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1153130 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>