How do i center the varient boxes on product page

[ampador]

I have included a photo of my issue, I am not sure how to center the varient boxes on my product page. If anyone can help out, it would be much appreciated. Thank you in advance!

my website is: https://ampador.com/

my password is: Ampador2020!

[Guleria]

Hello @ampador ,

Follow these steps:

1. Go to Online Store → Theme → Edit code

2. Open your base.css file and paste the following code at the bottom:

.product-form__input .select { 
    margin: 0 auto;
}
.quantity {
    margin: 0 auto;
}

[ampador]

Thank you so much for your help! I wanted to ask another favor.

Do you know how I am able to get all of the variant boxes the same length and size as the “add to cart” and “buy it now” button. As you can see in the photo i have attached, there are differences in the size of boxes for the variants. I want all of them to be the size of the add to cart and buy it now button.

Is there anyway you can help me with this? Thank you!