Docs

[theoutdoorarmory]

Hi,

My website is theoutdoorarmory.com

If you go here in my shop: https://theoutdoorarmory.com/store/ you will notice that products pictures are not in line horizontally.

How do I fix that?

This is also apparent in the “Related Products” page if you scroll down here:

https://theoutdoorarmory.com/product/gsi-outdoors-collapsible-fairshare-mug-650-ml-blue/

I attached two screen caps for your reference.

Thanks in advance.

[Rupok]

Hi there,

Thanks for writing in! it’s because the images are not same in size. You can set a height or max height for the featured image container by adding this under Custom > CSS in the Customizer.

.woocommerce li.product .entry-featured {
  max-height: 270px;
}

Hope this helps.

Cheers!

[theoutdoorarmory]

Hi,

Still not working. I attached screen caps of my CSS and the page.

🙁

[Thai]

Hi There,

Please try with this CSS instead:

.woocommerce li.product .entry-featured img {
    max-height: 150px;
    width: auto;
    min-width: auto;
}

Hope it helps 🙂

[theoutdoorarmory]

Thank you so much!

Just one last question.

Could you check my shop here: https://theoutdoorarmory.com/store/

And check what is the size of the thumbnail in pixels?

Thanks

[Thai]

Hi There,

Please try with this CSS:

.woocommerce li.product .entry-featured img {
    max-height: 115px !important;
}

Hope it helps 🙂

[Author]

Posts