How to remove spacing between rows of checkbox options

Solved

How to remove spacing between rows of checkbox options

magda1130
Visitor
1 0 1

How do I remove the vertical spacing between these checkbox variants? The wide spacing shows up regardless of whether I directly code the checkbox options in the product template or (as currently) I use an app to format it, which makes me think it's something in the main theme/style.

 

Screenshot 2024-08-27 123259.png

 

URL: https://mulberrycreektraditionals.com/products/multi-pack-tea-sampler-of-organic-medicinal-herbal-te...

Accepted Solution (1)

AnneLuo
Shopify Partner
1299 228 266

This is an accepted solution.

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code above the </head> tag

<style>
  .container-wrap-selection {
    height: 15px;
  }

  .tpo_error-message {
    margin-top: 30px;
  }
</style>

Result:

AnneLuo_0-1724805677254.png

 


Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to Email Me   

Buy Me A Coffee

View solution in original post

Replies 2 (2)

Made4uo-Ribe
Shopify Partner
10184 2417 3060

Hi @magda1130 

Where can I find this page? This is the result when I click your shared link.

Made4uoRibe_0-1724788598812.png

 

 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.

AnneLuo
Shopify Partner
1299 228 266

This is an accepted solution.

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code above the </head> tag

<style>
  .container-wrap-selection {
    height: 15px;
  }

  .tpo_error-message {
    margin-top: 30px;
  }
</style>

Result:

AnneLuo_0-1724805677254.png

 


Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to Email Me   

Buy Me A Coffee