How to reduce spacing between variation and add to cart button ?

Store Design
, , , ,
1

Hello,

after adding Klarna On-Site message blocks to my product page, the space between the variant and add to cart button have increased. Same with the space between the Klarna message and the add to cart button. I would like the buttons to be much closer to eachother, as they were before. I am thankful for any help.

Kind regards

This is my current theme (Dawn): justincase-de.com

6B1B21B9-300A-41B8-B7A6-43114645276D.png
6B1B21B9-300A-41B8-B7A6-43114645276D.png828×1792 146 KB

and this is how I want the space to be (merch-amsterdam.com):

DB6EC705-68B1-4319-BE46-BBE3BD1BE148.png
DB6EC705-68B1-4319-BE46-BBE3BD1BE148.png828×1792 126 KB

2

Hi @JustInCase-de

May I suggest to update code these steps:

  1. Go to Store Online-> theme → edit code
  2. Assets/section-main-product.css
  3. Add code below to bottom of file
body .product__info-container > * + * {
	margin: 1rem 0;
}
body .product__tax.caption.rte {
	margin-bottom: 2rem;
}
body product__info-container .product-form, 
body .product__info-container .product__description {
  margin: .5rem 0;
}
3

Thank you for your reply,

unfortunately that didn’t work.

Kind regards

4

Hi @JustInCase-de

Did you add CSS above? I dont see it in file(https://cdn.shopify.com/s/files/1/0645/7226/0616/t/42/assets/section-main-product.css?v=6810492666666591311673677197)