Support » Plugin: WooCommerce » Archive Page – Product Thumbnail Sizing

  • Resolved Daniel Chan

    (@danielchan23)


    Hi there,

    I’m experiencing an issue here. The size of my left column and right column product thumbnail is different in size.

    Any way I could make them the same size? Thanks! 🙂

    Here’s a screenshot in mobile view : https://snipboard.io/4fbgTd.jpg

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Hi @danielchan23,
    Hope you are doing well. I hope the below CSS will help you.

    .woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img {

    height: 170px;
    }

    For put, this code Go to Dashboard > Appearance > Customization > Additional CSS > Publish.
    Thank you.

    • This reply was modified 5 months, 1 week ago by Nadia Akther.
    Thread Starter Daniel Chan

    (@danielchan23)

    Hi Nadia,

    Thanks for your response! Unfortunately, that didn’t work for me. On mobile the thumbnail photo will look stretched.

    I tried tweaking the height px as well as adding width to the css code, but no luck, the left column width is still smaller than the right.

    Any other way around it? Thanks! 🙂

    Hi @danielchan23,
    Can you please try this one. I hope it will work.

    @media (max-width: 767px)
    .elementor-4303 .elementor-element.elementor-element-6af81b91.elementor-wc-products ul.products li.product {
        
        width: 140px !important;
    }

    Thank you.

    Thread Starter Daniel Chan

    (@danielchan23)

    Hey Nadia,

    Thanks! Found a similar code inputed last time. The width was ‘unset’.

    Added 140px and everything worked perfectly!

    Thank you so much for your help 🙂

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