Having issues with Ella theme product image frame height?

[k30lau]

I'm using Ella theme and everything was working fine.  Today, the product image on the product page are distorted.  It looks like both width and height auto is not working.  I tried using Chrome inspect to test the code.  If I change both width & height to 523px, then it works fine.  1) has there been a theme update that distorted the code? 2) How can I fix this?  Do I just add custom CSS to set to 523px?  I'm concern that will be a problem with the user has a different screen sizes.

[k30lau · Accepted solution]

Ella Theme also identified the issue and now provided a fix on their website.  There's alot of changes to make.

Troubleshooting Guide: Image Display on the Ella Theme in the latest C (halothemes.net)

[k30lau]

I even tried roll back to previous theme version and it doesn't work. 

[Dan-From-Ryviu]

Hi @k30lau Could you share your page URL to check?

[k30lau]

https://www.i-love-yoga.com.au/products/tejas-comfort-fabric-drawstring-loose-fit-joggers

[Dan-From-Ryviu]

It works well on my side. Could you try to clear your browser cache and check again?

[k30lau]

Thanks Dan.  May I ask which browser you are using? 

[Dan-From-Ryviu]

I have checked on Chrome, Safari and Firefox 

[k30lau]

Thanks Dan.  I just tried it on Bing, Opera, Safari, Firefox and they all worked.  I still can't get Chrome to work on both the laptop & mobile.  I cleared all the cache and even tried in incognito mode.  Looks like a Chrome exclusive problem.  Can you please confirm it's working for you on Chrome?  Because if it works for you in Chrome, then it will be my problem.

[Dan-From-Ryviu]

Yes, it is working well on my Chrome browser. I guess maybe one of your Chrome extensions may cause that issue, you can try to disable them and check again or use Incognito chrome browser and check.

[k30lau]

Thanks Dan. I actually tried it on 8 different devices with different profiles. None of the Chrome browsers worked.  Maybe one of the latest Chrome updates have broken it.  Do you have auto-update turned off on your Chrome?

[Dan-From-Ryviu]

Hi @k30lau 

I'm using Chrom on my Mac Mini and it is Version 120.0.6099.234

[k30lau]

Thanks Dan.  I just read Google released the Chrome update yesterday.

I'm using desktop version 121.0.6167.86 

Mobile version 121.0.6167.101

I reported the bug to Google.

[k30lau · Accepted solution]

Ella Theme also identified the issue and now provided a fix on their website.  There's alot of changes to make.

Troubleshooting Guide: Image Display on the Ella Theme in the latest C (halothemes.net)

[RobTORRO]

Thank you for sharing the link. Our custom theme is affected by the same issue and forcing it to use lazyloading seems to fix it. Is there any further information on "what" Google changed in the latest version of the browser?

[k30lau]

@RobTORRO I checked the changelog but nothing specific. 

[k30lau · Accepted solution]

@RobTORRO I'll take my words back.  I reported the bug to Google.  They have identified the issue and also applied a fix on their side.  The rootcause is AutoSizeLazyLoadImages.  Here is the full update from Google and official details.

a5856993c61543d4acbee5f848f1750607e87ba0 - chromium/src - Git at Google (googlesource.com)

1522175 - [User Feedback - Stable] Reports that the CSS object-fit property is rendering unexpectedl...