Return to previous page

Same height product boxes - by Martine - on WordPress WooCommerce support

This topic has 4 replies, 2 voices, and was last updated 3 years, 10 months ago ago by Rose Tyler

Martine

Participant

February 18, 2021 at 09:38

Hi!
Please check this image: https://www.loom.com/i/19cc7f98594942c39acbaa2c443c8ccd

Is it possible to make all productboxes the same height?

#274959 Copied Theme version: 7.2.4 WooCommerce version: 4.9.2

3 Answers

Rose Tyler

Support staff

February 18, 2021 at 09:54

Hello,

Try to add the next code in Theme Options > Theme custom CSS:

.main-products-loop .product, .products-loop .product, .carousel-area .product-slide .product {
    display: flex;
    justify-content: center;
}
.products-loop .ajax-content, .products-loop {
    display: flex;
    flex-wrap: wrap;
    flex: 1;
}
.content-product {
    flex-direction: column;
    justify-content: space-between;
    display: flex;
    flex: 1;
}
.content-product .quantity-wrapper {
    margin-right: auto;
    margin-left: auto;
}
.swiper-container {
    display: flex;
    align-items: stretch;
}
.product-slide .product {
    display: flex;
    height: 100%;
}
.swiper-wrapper {
    height: auto;
}

Regards

#274961 Copied

Martine

Participant

February 18, 2021 at 10:14

Yes! That works! Thanks!

#274965 Copied

Rose Tyler

Support staff

February 18, 2021 at 10:32

You’re welcome!

Regards