Centralising Product on Refresh Theme

Store Design
, , , ,
1

Hey guys, yes I’ve read the other tutorials on how to centralise the data but it isn’t working;

https;//cleansalt.co is the website

Aiming to centralise these two, the first is on my home page and second is on my product. I want to centralise the price, quantity selector, and size. Including their buttons. Also want to centralise the heading. Below are two photos, one of my main page and one of my product

Thanks for all the help!

1 Like
2

Hey @cleansaltco

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1745306849536.png
Moeed_0-1745306849536.png784×715 173 KB

If I managed to solve your problem then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like
3

Hi @cleansaltco ,

Please go to Actions > Edit code > Assets > section-main-product.css file and paste this at the bottom of the file:

.product__info-container>* {
    text-align: center;
}
.product__info-container .quantity {
    margin: auto;
}
4

This did not work?

1 Like
5

Also did not work

6

Can you show me a screenshot of the code which you have added, the code is completely fine. It could be a issue of where you added the code.

Best Regards,

Moeed

7

Hey sorry mate, fixed it. thanks again!

8

Is there a way to do it to the home page aswel?

eg; the product on https://cleansalt.co

9

Hi @cleansaltco ,

Please go to Customize > Theme settings > Custom CSS and add code.

.product__info-container>* {
    text-align: center;
}
.product__info-container .quantity {
    margin: auto;
}

result

Screenshot.png
Screenshot.png1276×1052 34.6 KB