Hey @vegasims
The issue is related to the equalize height which you are using and the lazy load.
When the page loads, the equalize height gets the height of the biggest box, and change the height of the other boxes.
But when the lazyload is active, we change the default image with a placeholder. The height of the placeholder is bigger, compared to the height of the image. Then the equalize height calculates the height of the elements, using the height of the placeholder + the height of the content.
And finally, when the lazyload, replace the placeholder, with original images, the sections look too big.
Here is a screenshot, how the boxes look, before the lazyload replace the placeholders: https://cloudup.com/cNvEL7F8o8M
You can exclude those images in the plugin interface or you can disable the equal height.
Regards,
Stanimir
Thread Starter
VS
(@vegasims)
@sstoqnov thanks so much. We’ve been scratching our heads for months on this. We changed the Elementor settings from masonry to grid and it solved the problem!
I am experiencing this issue with buttons in Elementor, i.e. any specified spacing is canceled-out, however this was never an issue before. I talked to Elementor support and they found that SG Optimizer somehow overrides CSS spacing such that my buttons are all crunched together (0 spacing). This affects all websites where I use both SG Optimizer and Elementor. Google Analytics is sending me multiple emails about this issue, since buttons too close together is strongly against “best practice”.
See diamondarm.no (social media icons crunched together in top right).