Make Desktop Add to Cart Button Full Width in Ware house Theme

Solved

Make Desktop Add to Cart Button Full Width in Ware house Theme

MOCHILOCO
Explorer
53 0 20

Hi guys! What code can I add to make the Add to Cart button full width/centered on the desktop version of Ware house theme? Thanks in advance for the assistance!

 

Store: www.mochilo.co

Shop1.jpg

Accepted Solution (1)
maufa_42
Shopify Partner
8 1 1

This is an accepted solution.

https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/add-css
I guess this will help you to write the component specific CSS.


.product-form__add-button {

flex-grow: 1;
}
This particular is what you need to add

View solution in original post

Replies 6 (6)

maufa_42
Shopify Partner
8 1 1
 

 

flex-grow: 1;

you just need to add this property to that button.

 

MOCHILOCO
Explorer
53 0 20

Thank you! But exactly where do I add it?

maufa_42
Shopify Partner
8 1 1

<button type="submit" class="product-form__add-button button button--primary" data-action="add-to-cart" style="
flex-grow: 1;
">COMPRAR</button>

Like This

MOCHILOCO
Explorer
53 0 20

Great. And where do I add it? What file?

maufa_42
Shopify Partner
8 1 1

This is an accepted solution.

https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/add-css
I guess this will help you to write the component specific CSS.


.product-form__add-button {

flex-grow: 1;
}
This particular is what you need to add

MOCHILOCO
Explorer
53 0 20

Added that to the bottom of theme.css file and it worked. Thanks for the help!