How to decrease the space between Buy Button and Product description in DEBUT theme (see on picture)
Topic summary
Issue: Large vertical gap between the Buy (Shopify payment) button and the product description in the Debut theme, illustrated with screenshots.
Context/Info shared:
- Helpers requested the store URL and exact page; the merchant provided bayondo.com and a specific product link.
Solution provided:
- Add custom CSS to the theme stylesheet (theme.scss.css) at the bottom to reduce the spacing:
.shopify-payment-button { margin-bottom: -55px !important; } - CSS (Cascading Style Sheets) controls layout and spacing; applying a negative margin shrinks the gap below the payment button.
Outcome:
- Merchant confirmed the CSS change worked.
Status:
- Resolved. A later message asked if it was solved, but no further changes were needed.
Notes:
- Images were central to showing the spacing problem and desired layout change.
Hii, @Alex304
Kindly share your store URL so,
I can solve it perfectly.
Thank You.
Hello @Alex304 ,
Hope you are doing well.
You can decrease the space by adding custom CSS code to your theme file. If you are not good at coding then please share your store URL so that we can send you the snippet that you need to add to your theme file.
https://bayondo.myshopify.com/
Thanks for Help
@Alex304
Can you give me the page link where you are seeing this error?
Thank You.
Hello @Alex304 ,
Please add the below CSS in theme.scss.css theme file at the bottom.
.shopify-payment-button {
margin-bottom: -55px !important;
}
Worked. Thanks
@Alex304 Great!!
You’re welcome!
https://community.shopify.com/topic/1910503
hey can you resolve it ?