Please help center quantity selector and text above it on MOBILE ONLY

Store Design
1

Hello! I would like to have the quantity selector centered on mobile only, as well as the “Quantity” and “tax included” text above it. I do not want the product title centered. Please help me with this, thanks in advance!
crescent.hu

Pw:theaba

image
image450×507 15.9 KB

2

@crescenthu Hi there! :waving_hand:
To center only the quantity selector and its labels (“Quantity” + “tax included”) on mobile without touching your product title you can add this CSS:

@media screen and (max-width: 749px) {
  .product-form__quantity {
    text-align: center;
  }
  .product-form__quantity .quantity {
    margin: 0 auto;
  }
}

This way:

  • Works only on mobile.

  • Centers the text and selector nicely.

  • Keeps your product title left-aligned.

3

Hello @crescenthu

From your Shopify Admin, navigate to Online Store > Themes > Edit Code
In the Assets folder, open base.css and add your CSS code at the end

@media screen and (max-width: 749px) {
  .product-form__quantity {
    text-align: center;
  }
  .product-form__quantity .quantity {
    margin: 0 auto;
  }
}