How can I reduce white space between sections in Studio theme?

Technical Q&A
,

Topic summary

A user seeks to reduce white space between a Rich Text section and an external review slider app in the Studio theme. Standard customization settings don’t allow sections to be positioned closer together.

Solutions offered:

  • Custom CSS approach: Add specific CSS code targeting the slider wrapper element to remove top margin (#kbz-slider-wrapper.svelts-1n9q8se { margin-top: 0; })

  • Theme.liquid modification: Insert custom <style> code above the </body> tag in the theme.liquid file to adjust section padding globally or for specific sections

  • Professional assistance: One responder offered to implement custom code via Shopify Partner Portal access to optimize padding across the site

Outcome: The user confirmed the solution works perfectly after implementing the suggested code fix.

Summarized with AI on November 10. AI used: claude-sonnet-4-5-20250929.
1

Good morning,

I would like to eliminate, or at least reduce, a white space between a Rich Text section and a review slider (I installed an external app for that). From the basic costume settings I can’t get them any closer than this. The theme used is ‘Studio’

I’ve already looked at the code but there doesn’t seem to be anything between the two sections.

I’m asking someone more experienced for help.

spazio-bianco-2.jpg
spazio-bianco-2.jpg608×468 27.7 KB

Thank you.

Matteo

Web: atlasprints.it

Pass: beabep

2

Hi @AtlasPrints ,

Thanks for being part of the community! What you are saying makes absolute sense.

You need to reduce the padding in order to do that. This can be completed at an individual level - meaning that you’ll reduce the padding just for those 2 sections - or at a global level - meaning that you can reduce the padding overall, across the website, if you face the same issue somewhere else.

I would like to help by implementing a small custom code that your store can benefit from to reduce the padding and increase the user experience. I’ll have to access your store through the Shopify Partners Portal. If that’s okay, just send me a private message with your Shopify URL and Collaborator Code.

3

I have reviewed there some additional spaces due to CSS code. The screenshot you shared will be fixed by below code

#kbz-slider-wrapper.svelte-1nq9s8e {
    margin-top: 0;
}
1 Like
4

Hey @AtlasPrints

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above tag.

RESULT:

Moeed_0-1712131984412.png
Moeed_0-1712131984412.png1486×461 19.3 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

5

It works perfectly.

Thank a lot!

Matteo