Help with Centering Size Text, Variety Pills, and Quantity Text after Dawn 10.0 updaate

Solved

Help with Centering Size Text, Variety Pills, and Quantity Text after Dawn 10.0 updaate

ClubEvince
Excursionist
15 0 4

I need help with centering my Size Text, my Variety Pills, and my Quantity Text. I updated to Dawn 10.0.0 on Shopify and all of these became off-center. I added a picture below.

 

My website is clubevince.com

 

Thanks in Advance

ClubEvince_1-1686960088495.png

error.png

Accepted Solution (1)

made4Uo
Shopify Partner
3877 719 1234

This is an accepted solution.

Hi @ClubEvince 

 

Please see the instructions below

 

1. From you Admin page, go to Online store > Themes > Click the three dots on the theme you want to edit > Edit code
2. Go to Asset folder and open the base.css file
3. At very end of the code, add the code below

 

 

.form__label {
    width: 100%;
    text-align: center;
}

fieldset.js.product-form__input {
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.product-form__input.product-form__quantity {
    max-width: 100%;
}

/* If you need to center the buttons too */
.product-form__buttons {
    margin: auto;
}

 

 

 

Result below:

made4Uo_0-1686963467309.png

 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free

View solution in original post

Replies 4 (4)

made4Uo
Shopify Partner
3877 719 1234

This is an accepted solution.

Hi @ClubEvince 

 

Please see the instructions below

 

1. From you Admin page, go to Online store > Themes > Click the three dots on the theme you want to edit > Edit code
2. Go to Asset folder and open the base.css file
3. At very end of the code, add the code below

 

 

.form__label {
    width: 100%;
    text-align: center;
}

fieldset.js.product-form__input {
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.product-form__input.product-form__quantity {
    max-width: 100%;
}

/* If you need to center the buttons too */
.product-form__buttons {
    margin: auto;
}

 

 

 

Result below:

made4Uo_0-1686963467309.png

 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free
ClubEvince
Excursionist
15 0 4

Thank you so much! Fixed it perfectly!

Zqdo
Shopify Partner
803 32 64

Hi @ClubEvince, I saw you were able to get some help. Were you able to figure out the issue? 

banned
ClubEvince
Excursionist
15 0 4

Yep! I appreciate your time though!