How to move "add to cart button"

[Fahadhassan]

Hello community, hope eveyone is doing well. I’m using a Shopify broccoli theme and I want to move the “add cart button” on just mobile site. store url: https://nabatat.pk/products/relieve-pro-muscle-joint-pain-relief-oil. Thanks in advance
Reference image

[thirtycoders]

Hello @Fahadhassan ,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file → Save

Thanks!

[Fahadhassan]

Thanks, it worked. can we also rearrange this like the below image?

[Jack_Khan_Baba]

remove the previous code that you can add before
and the below one in the theme-custom.css or in style.css
@media only screen and (max-width: 768px) {
.shop-details-info .cart-plus-minus {
width: 100% !important;
}
.ltn__product-details-menu-2 ul li {
width: 100%;
}
button#AddToCart {
width: 100%;
}
}
you get the following result. if want anything else feel free to ask

[Fahadhassan]

Thanks for your help, it’s working but it isn’t aligned correctly

[BSSCommerce-HDL]

Hi @Fahadhassan

You can adjust your buttons by adding the following code snippet after your previous code snippet.

.ltn__product-details-menu-2 ul li:last-child {

     margin-right: 10px !important;

}

@media only screen and (max-width: 600px) {

   .product-cart-action {

         left: 0px !important;

     }

}

Hope this can help you.

Kind regards

[Anshul_arora]

Hello @Fahadhassan ,

I have reviewed your store link and see that the “Add to Cart” button is not properly aligned.

Please add the below-mentioned code at the bottom of the theme.liquid file before tag and save

After applying code output will be like this →

I hope the code helps you.

Please share if you have any queries.

Thank you.