How do i center all content on products page - Dawn theme

[Blacksanctuary]

i'd like to center the heading, price, variants, add to cart, just everything! thank you!

https://blacksanctuary.eu/products/dead-inside

[Zworthkey · Accepted solution]

hii, @Blacksanctuary 
Paste this code on top of the base.css file or section-main-product.css file.

.product__info-wrapper.grid__item {
    text-align: center !important;
}

Thank You.

[Zworthkey]

hii, @Blacksanctuary 
Kindly share your store URL so,
I can solve your issue.
Thank You.

[Blacksanctuary]

@Zworthkey 

https://blacksanctuary.eu/

thanks!

[Zworthkey]

@Blacksanctuary 
Can you give me a screenshot of what you want to move in center?
Thank You.

[Blacksanctuary]

@Zworthkey Sure

[Zworthkey]

@Blacksanctuary 
Ok.

[Blacksanctuary]

@Zworthkey 

it won't let me share the screenshot cause it's JPG
i tried to change file in photoshop but there isn't the one they ask for 

[Zworthkey]

@Blacksanctuary 
At the present time, what do you use? Phone or Desktop?
if you use the Desktop so take the screenshot with the Win+print screen button and sent me.  

Thank You.

[Zworthkey]

@Blacksanctuary 
Do you want this all to the center?

Thank You,

[Blacksanctuary]

@Zworthkey 

no, take a look at this link please, thank you!

i want the center everything on the right :

SEX AND DEATH CROP TOP
29 EURO
SIZE L M ETC
COLOR
ADD TO CART
ADD TO WISHLIST
SIZE CHART
DESCRIPTION
SHIPPING RATES

from this to this :

SEX AND DEATH CROP TOP
29 EURO
SIZE L M ETC
COLOR
ADD TO CART
ADD TO WISHLIST
SIZE CHART
DESCRIPTION
SHIPPING RATES

https://blacksanctuary.eu/products/sex-and-death-crop-top
on all products pages

[Zworthkey · Accepted solution]

hii, @Blacksanctuary 
Paste this code on top of the base.css file or section-main-product.css file.

.product__info-wrapper.grid__item {
    text-align: center !important;
}

Thank You.

[Blacksanctuary]

@Zworthkey  

thanks! it worked for everything except the price as you can see

[Zworthkey · Accepted solution]

@Blacksanctuary 
Paste this code on top of the component-price.css file.

@media only screen and (min-width: 992px) {
span.price-item.price-item--regular {
    margin-left: 150px !important;
}
}

Thank You.

[Blacksanctuary]

@Zworthkey 

thank you so much for your help!

[Joelshop]

It does work, but how do i only center the things on mobile and not on desktop?

[Just1n]

Hello, this solution worked for me, but I was wondering if there was any way to keep the product description to the left, but keep variant pickers, price, and everything else in the center?