Woocommerce Product Images are Being Cutoff

Just as the title says, my woocommerce product images on single product pages are being cutoff on screenwidths between 767px wide and 1360px wide. How can I stop this from happening? I am using Woocommerce Version 3.2.6 and X theme Version 5.2.5 with a child theme installed. I think it has to do with the flex viewport for the product images but I am not certain.

Howdy, @rlmills3rd!

Thanks for writing in! Please make sure that you’re updated to the latest version of the theme (v6.0.2) as well as WooCommerce, as this is working as expected in my local development environment. If it is still happening after updating, it could be related to some custom styling or functionality you’ve introduced to the theme, which you will need to audit to see what is going on.

Hopefully this helps to point you in the right direction, cheers!

I’d prefer not to update at this time until all the bugs are worked out. I think this started when I regenerated the size of the thumbnails for the woocommerce products on my site. Is there a way to make the images responsive?

I was able to add this CSS styling:

@media (min-width: 760px) and (max-width: 1360px) {
  .woocommerce div.product .images {
    max-width:50%;
  }
}

It works but not sure if this is the best way to achieve my goal.

@rlmills3rd, this update has been live now for almost 24 hours and we’ve received very little response in terms of issues from the community, updating should not be an issue. That is the recommended way forward at this time.

I held my breath and updated… The situation is solved by the update. Thanks!

Glad it’s okay now, cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.