Remove White Space under menu/header (Studio Theme)

Hi,

I’ve been trying to remove the gap between a video I have and the menu but can’t figure out how to do it.

There is a similar post I saw: Solved: remove white space - Shopify Community but I don’t have the theme.scss.liquid file so the solution doesn’t work.

Any help would be appreciated!

Thanks,

James

1 Like

Hi @ClaytonJ

This should be an easy fix with CSS. My advice if you have a complex theme and just want to override some CSS rules:

  • Instead of modifying existing CSS assets create a new CSS file in your assets folder (ex : ‘custom-styles.css’)

  • Include your CSS file in your theme.liquid before the end of (ex : {{ ‘custom-styles.css’ | asset_url | stylesheet_tag }})

  • Create some CSS rules in your ‘custom-styles.css’ . My guess is you just have to ajust the margin-bottom/padding-bottom of your header and/or margin-top/padding-top of your video section

Hi @Lainedev ,

Thanks for your reply!

Please could you give me some pointers on what the custom rules need to be? I am new to coding so don’t really know where to start with this.

@ClaytonJ

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

Hi @KetanKumar ,

Site URL is https://sawai.co.uk/

Password is: awskao

Thank you for your help!

Hello @ClaytonJ
This is GemPages - A powerful Page Builder. Regarding your question, I would like to give you some recommendations to support you
You can add this code to theme.liquid like this

Code:


Hope my recommendation can works and support for you! Kind & Best regards! GemPages

1 Like

Thank you @GemPages .

Worked perfectly!

I am glad that my solution is helpful to you :grin: .