Images not loading in Safari when ‘Lazy-loading’ is activated

Never encountered this as a generic problem I’m afraid Theo, can you share a URL where this is happening so I can have a look?

Sure, I just created a Staging environment for this.
This is the link: https://wordpress-627703-2317404.cloudwaysapps.com/blog/website-seo-optimization/
You can see within the post content, above the Image Source links that there’s no image.

OK, the problem is with a bit of CSS which sets image size to auto/auto;

.single_post_content img {
  width: auto!important;
  height: auto!important;
}

The CSS comes from wp-content/themes/new-reach-marketing/css/style.css and it *think* Safari is very strict about the !important flag there.

To confirm; either briefly switch theme OR change (remove) the code from the theme’s style.css. If/ when confirmed you might want to reach out to the theme developers to ask what the aim of said code is?

Thank you Frank!

The purpose of the code was to allow images to render naturally in case they had some fixed attributes and remain within their parent with the proportional height. Didn’t imagine that this would interfere with the Short-Pixel lazy-loading.

I just removed height: auto; and that was enough. Thanks again!

you’re welcome, feel free to leave a review of the plugin and support here! 🙂

 

This site will teach you how to build a WordPress website for beginners. We will cover everything from installing WordPress to adding pages, posts, and images to your site. You will learn how to customize your site with themes and plugins, as well as how to market your site online.

Buy WordPress Transfer