I have the exact same problem with the exact same behaviour: Attachment Srcset causing images to be distorted
It is very unpredictable and I can’t reproduce it every time but different customers have reported experiencing the issue on our site.
I have a feeling the it’s a combination between srcset, aspect ratio and image size. But I can’t prove it since it’s is so difficult to reproduce the problem.
I’m also running FlyPress for cache.
Do others have the issue as well?
Hello @Dagaloni,
Thanks for writing to us.
In order to help you with your concerns, we need to check your settings. I would request please share the admin login details meanwhile I would suggest you troubleshoot a few of the common issues before we investigate your settings. Please share your details in a secure note. Please provide the following details
You can find the Secure Note button at the bottom of your posts
Thanks
Hi @prakash_s, thank you! I added the login details to my post.
The problem is, I can’t reproduce it. On my end everything looks good, but I have reports from users who still see the distorted images.
Hello @Dagaloni,
Thanks for sharing the login credentials. I went ahead and checked your site, and it seems that it is working fine on my end. I have tested it on the Google Chrome browser version 140.0.7339.133. It might be the issue of browser cache. I would suggest you please purge all the browser cache and recheck it again.
Thanks
Hi @prakash_s thank you! Yes I know. I found a page where I currently see images distored: https://sanopharm.com/achtergrond/emulsan-vetoplosbare-vitaminen/
Cache is purged multiple times, without effect.
There are three suspects. The effect is fixed when I turn one of these css-lines off in the inspector:
img {height: auto;}
.mmkr-2.x-image img {aspect-ratio: auto;}
img:is([sizes="auto" i], [sizes^="auto," i]) { contain-intrinsic-size: 3000px 1500px; }
I’m also on Chrome 140.0.7339.133.
I can only see it in Chrome. I tried to replicate it in Safari and Firefox but failed.
Alright! I think I found the answer. In the last post I noticed that the effect was only in Chrome and found that I could replicate the issue in Chrome.
It looks like a setting called Properly Size Images in FlyingPress was causing the issue. I turned if off and it’s fixed now.
Still, the might be interesting to look into as there might be a conflict between Pro and FlyingPress. I have also notified FlyingPress about the problem.