Price not centered in "You may also like" section when compare price is shown (Sense theme)

Technical Q&A
1

Hi everyone,

On my product page, there’s a “You may also like” section at the bottom with recommended products. When a product has a compare price (e.g. a discount), the price is not centered under the product title and star rating – especially on mobile, or even on desktop when resizing the browser window.

How and where can I fix this so that the price (including compare price) is centered below the star rating, just like with regular prices?

www.kyotsu.ch (e.g. https://kyotsu.ch/products/santokumesser > at the bottom)
PW: kyotsu.ch

Thanks a lot in advance!

Best regards,

Tobias

2

Hi @tobiaszellweger

Try with this: find in your theme file assets/component-price.css and at the end of it add following code:

.related-products .price>* {
    display: flex;
    flex-direction: column;
}

.related-products .price.price--on-sale .price__sale {
    flex-direction: column !important;
    justify-content: center;
}

.related-products  .price--on-sale .price-item--regular {
    margin: 0 auto;
}
1 Like
3

It worked, thank you so much! :blush:

1 Like