Archived topic
Align Product Price
5 replies · Started by Ash on May 27, 2020
So I would like to align prices in product categories, I found this code
.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
margin-bottom: unset !important;
flex: 1;
display: flex !important;
flex-direction: column;
}
.woocommerce ul.products li.product .price {
margin-top: auto !important;
}
But if 1 entire row of products have shorter titles it makes the product card different size to other rows. If you look at the link the 3rd product has a shorter title so price isnt level with the other 3 products. I want the price to be level with the other 3.
Hi there,
that code looks to be working for me - browser cache maybe? If not which browser are you viewing it in ?
This is what I mean
Hmmm... maybe give the Title a minimum height like so:
.woocommerce ul.products li.product .woocommerce-LoopProduct-link h2,
.woocommerce ul.products li.product .woocommerce-loop-category__title {
min-height: 45px;
}
Perfect thanks :)
You're welcome