add to cart button doesn't resize to mobile view.. [supply theme]

Solved
ImDedi
Explorer
69 1 20

Hi,

When my add to cart button doesn't adjust to my screen size.

Does anybody know how to fix this issue?

my website: https://imdedi.com

ImDedi_0-1618578662332.png

 

dmwwebartisan
Shopify Partner
5799 1328 1701

This is an accepted solution.

@ImDedi 

 add the following code at the bottom of your assets/theme.scss.liquid file.

 

 

@media only screen and (max-width: 768px){
.template-index #addToCartForm-collection-row-1 .btn--add-to-cart {width: 152px !important;}
.template-index .btn--add-to-cart{width: 152px !important;}
.template-index #addToCartForm-collection-row-2 .btn--add-to-cart{width: 152px !important;}
.btn--add-to-cart {font-size: 9px !important;}
}

 

 

Hope this works.
Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes

This is an accepted solution.

@dmwwebartisan, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

@media (max-width: 768px){

[id*='collection-rows']  .btn--add-to-cart {
    max-width: 152px !important;
    width: 100% !important;
    }

[id*='collection-rows']   .btn--add-to-cart {
    font-size: 10px !important;
    }

    [id*='collection-rows'] .product-item--price {
    margin-top: 90px;
    margin-bottom: -50px;
}
}



Please let me know whether it works.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Add a slider to product page images: Minimal theme | Debut theme | Brooklyn theme
◦ Contact: ezfycode@gmail.com.
0 Likes