• After a recent woocommerce plugin update, I noticed that the aspect ratio of the images in the loop changed. Until now, I had square graphics (the original 1:1 aspect ratio of the product images), but an additional “auto” parameter has arrived in the html code generated by the WC plugin:

    <img src=“...” .... sizes=“auto, (max-width: 300px) 100vw, 300px”>

    Because of this, the image still has a height of 150px, which I set in the CSS style max-height: 150px;, but it stretches to 100% of the width of the available space in the tag of the product list.

    My styles for the image:

    img {
    width: auto;
    height: auto;
    max-height: 150px;
    margin: auto;
    display: block;
    }

    Not even adding aspect-ratio: 1/1 helps;

    This was not there before. Only when I remove the word “auto” from the tag does the image take the correct aspect ratio again.

    On desktop devices I can set max-width: 150px; permanently, but on mobile devices it is impossible, due to different screen resolutions.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hi there! Thanks for the report.
    QQ: Could you share some screenshots or even a website where we can look? It will help us understand the underlying issue.

    Plugin Support shahzeen(woo-hc)

    (@shahzeenfarooq)

    Hi there!

    To assist you further, could you clarify:

    1. Are the affected images the product thumbnails, featured images, or images displayed in a specific product page section (e.g., product gallery or loop)?
    2. If possible, can you share the URL of the exact page where this issue occurs? That way, I can check the HTML and CSS to provide tailored guidance.

    I checked the issue on my test site but couldn’t find the auto tag in the image HTML. Once we have more information, we’ll be happy to assist you in resolving the issue.

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.