Centering Compare at Price - Product Page + Recommended Products

26 0 10

Theme: DEBUT


password: ppf


I am trying to center the compare at price as it tends to overlap with my price, particularly on the product page and on the recommended product page.

Here are some images:Screen Shot 2021-07-01 at 7.41.45 AM.pngScreen Shot 2021-07-01 at 7.41.59 AM.png

Is there a way to add some sort of margin between these two?

Thank you.

Shopify Partner
7318 1729 2305

This is an accepted solution.


Please add this code at the bottom of your assets/theme.css file.

.product__price .price dd {
    margin: 0 0.5em 0 0!important;
.product-recommendations__inner .price--on-sale .price__sale{
justify-content: center;
.product-recommendations__inner .price dd {
    margin: 0 0.5em 0 0!important;


Hope this works.


If helpful then please Like and Accept Solution | Email: | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →