Aligning color swatches to center

[Everup]

Hi! Im using Dawn theme and want to align variant color swatches to center. I’ve tried everything that can be found on this forum, but nothing worked.

My store’s URL https://kz8dwg-0f.myshopify.com/products/multifunctional-fitness-board-exercise-machine-4-in-1-abdominal-board-workout-board-push-ups-stands-pilates-home-gym-equipment

[Moeed]

Hey @Everup

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

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Everup]

Thank you! Variant swatches aligned to the center.

But now I have a weird problem with “quantity” button which is aligned to center in the editor, but when I check on my phone it’s still aligned to the left. Could you help me with this also?

[devcoders]

Hello @Everup

Go to Online Store, then Theme, and select Edit Code.
Search for assets/base.css Add the provided code at the end of the file.

.product-form__input--swatch {
justify-content: center !important;
}
.price-per-item__container {
justify-items: center !important;
}

[Everup]

Didn’t help unfortunately, quantity box is still on the left side

[devcoders]

Hello @Everup

Go to Online Store, then Theme, and select Edit Code.
Search for assets/base.css Add the provided code at the end of the file.

.product-form__input--swatch {
justify-content: center !important;
}
.price-per-item__container {
justify-items: center !important;
}
.price-per-item__container quantity-input.quantity {
    margin: 0 auto;
}

[Everup]

AWESOME! THANK YOU SO MUCH

[devcoders]

Hello @Everup

You’re very welcome! I’m thrilled to hear that you’re pleased with the outcome. Don’t hesitate to reach out if you need further assistance. like and accepting the All solution. Thank you!