This topic has 3 replies, 2 voices, and was last updated 2 years, 10 months ago ago by densitysk
HI,
Originally you have helped me to align the products in the catalog so the product images and add to cart buttons are aligned correctly
https://www.8theme.com/topic/align-simple-and-variable-products-in-catalog/#post-309361
You have provided me the below CSS code to do that. However after the recent theme update I have found out that with this CSS code the main product categories are now misaligned. When I remove the CSS code, the categories are OK but the products themselves are broken again.
Can you please check?
Screenshots:
https://ibb.co/x5GVbQx
https://ibb.co/WDYybD3
CSS CODE
/* Alignment of product catalog – MANSORY must be disabled */
.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;
}
Hello,
Please change this part of code – https://prnt.sc/26pk597 to:
.main-products-loop .product:not(.product-category), .products-loop .product:not(.product-category), .carousel-area .product-slide .product {
display: flex;
justify-content: center;
}
Regards
that helped a lot. Thank you.
Tagged: category, misaligned, page, shop, themes, woocommerce, wordpress
The issue related to '‘Shop category page misaligned after recent update’' has been successfully resolved, and the topic is now closed for further responses