[keker13]

Hello

I have problems with my lading page excerpts overlapping on mobile device. I tried to figure out why, and I noticed that the top position of the article is sometimes to low and this is causing the issue.

<article id="post-3099" class="category-practical-tips format-standard has-post-thumbnail hentry masonry-brick post post-3099 status-publish tag-coronavirus type-post" itemscope="" itemtype="http://schema.org/BlogPosting" itemprop="blogPost" style="position: absolute; left: 0%; top: 624.8px;">

The top value causes the articles to overlap, but after refreshing the page it changes value to 773,5px and then the site looks fine in that area.
I tried shortening the excerpts, removing ads but still the top value seems to be calculated randomly.

What may cause that problem and how to fix it?

Regards
Maciek

• This topic was modified 3 years ago by keker13.

[Zed]

The theme uses Masonry (a Javascript library) to arrange the posts in lists in a brick style layout.
If you use lazy loading (or some other loading optimizations techniques) on your site, Masonry can end up applying its layout before everything is loaded and not take the final sizes into account.

We’ve made Masonry apply at the very end of page rendering, but some optimization plugins can interfere with this. Try temporarily disabling such optimizations to check if they’re connected to the issue or disable Masonry in the theme.

---

If you like our creations, help us share by rating them on WordPress.org.
Please check the available documentation and search the forums before starting a topic.

[Author]

Posts