Code to make the "add to cart" buttons smaller in featured collection.

[3D-Cast]

Hi

I'm just after some help with a code to make the "add to cart" buttons half the current width in the featured collection section on my home page. As you can see in the pic they go right across the product tile. 

Thanks

[B2Bridge]

Hi @3D-Cast 
Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.

[B2Bridge]

Hi @3D-Cast, Can you give us store url?

[3D-Cast]

Sure, https://3dcaststore.com.au/

Thanks 

[B2Bridge]

Sorry, but I can't see the button on collection page. Can you set one of the products to available? 

[3D-Cast]

Hi

I'm trying this feature on my testing theme. I don't want these buttons on my live theme until I can get their size right

[B2Bridge]

So, can you download your theme and share your zip file with us? We will help you check it and suggest you a solution.

[mohan610]

Hi @3D-Cast 

Please add this code at the end of base.css file 

.quick-add button.quick-add__submit {
       min-width: max-content;
       width: max-content;
       margin: 0 auto;
       padding: 0 25px;

}

[3D-Cast · Accepted solution]

Thanks Mohan610

That is working well. What is the code to get the button to be centred on the product tile. In the picture you can see the button is off to the right a bit. Also any ideas on how I can get the "choose options" button to look the same as the add to cart. Thanks

[mohan610]

Hi @3D-Cast 

Please share the working theme link so that, I can check the solution for button center alignement and choose options issue.

[mohan610]

Hi @3D-Cast 

Welcome, please make accepted solution to my reply

[LizHoang]

Hi Simon159

You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file base.css and add this code at the end of the file

.quick-add button.quick-add__submit {
    min-width: max-content;
    width: max-content;
    margin: auto;
    padding: 0 20px;
}

Result (example) 

Best

Liz