FROM CACHE - en_header

How do I center align elements in my product page? Dawn Theme

Solved
PeterMantu
Excursionist
15 2 3

Hi all,

 

Can someone please assist me with aligning elements as shown in the image? I have been struggling with this all day long...my store URL is hereCenter product page elements.png

 

Peter Mantu
Company Website: https://www.pnpaiiih.com/
Shopify Store: https://queenswalkincloset.com/
Accepted Solution (1)

Accepted Solutions
JHKCreate
Shopify Partner
3467 625 882

This is an accepted solution.

Hi @PeterMantu !

 

Let's try the following:

 

- To center the price:

.product .price {
    align-items: flex-start;
    float: center !important;
    justify-content: center;
}

In the code above, "justify-content: center;" was added.

 

- To center the quantities modifier, add the following:

.product-form__quantity {
    margin: auto;
}

 

Cheers!

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com

View solution in original post

Replies 2 (2)
JHKCreate
Shopify Partner
3467 625 882

This is an accepted solution.

Hi @PeterMantu !

 

Let's try the following:

 

- To center the price:

.product .price {
    align-items: flex-start;
    float: center !important;
    justify-content: center;
}

In the code above, "justify-content: center;" was added.

 

- To center the quantities modifier, add the following:

.product-form__quantity {
    margin: auto;
}

 

Cheers!

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com
PeterMantu
Excursionist
15 2 3

Hi @JHKCreate, thanks for your response. Can you please advice as to where I should paste the above codes?

Peter Mantu
Company Website: https://www.pnpaiiih.com/
Shopify Store: https://queenswalkincloset.com/