How do you center all the text and price on the Alchemy Theme product page

Store Design
, , , ,

Topic summary

Goal: Center the product information text and price on a Shopify product page using the Alchemy theme. Text was centered, but the price remained left-aligned.

Context: A preview link and a screenshot were shared to illustrate the desired alignment change.

Fix provided: Add a CSS rule in main.css targeting the price element:

  • Selector: .product-info__price.text-lg.md:text-xl.js-product-price
  • Declaration: margin-left: auto; margin-right: auto;
    This uses auto margins to center the price block. Note: The escaped colon (:slight_smile: in md:text-xl is required in CSS selectors.

Outcome: The change worked as intended; the price was centered alongside the text.

Status: Resolved. No further actions or open questions.

Summarized with AI on December 15. AI used: gpt-5.
1

Hi

I’m trying to center the text and price on the product page/product information.

I can get the text to center but not the price, it is still justified left.

Theme is Alchemy

preview link

https://jzfxw9gmafifi4n8-50100633760.shopifypreview.com

Thanks

2

Text/price location i want to move

Screenshot (333).jpg
Screenshot (333).jpg1779×1080 189 KB

3

Hi @JeremySkeggs , go to main.css and add the fo

.product-info__price.text-lg.md\:text-xl.js-product-price {
    margin-left: auto;
    margin-right: auto;
}

llowing code :

1 Like
4

Like magic and it worked, thanks for that. Very much appreciated.

1 Like