Remove/adjust white space between header and content on Turbo theme

JaySway
New Member
8 0 0

Hi, 

I'm using the Turbo theme (4.1.3), and I'd like to know how to adjust, or completely get rid of the white space just below the menu/navigation bar, and above the page content on all pages. This looks especially bad on mobile. Please see the 2 attached screenshots where I have indicated the said white space in red markings.

Also, I'm using the theme's 'search block' section on the homepage. How do I adjust the height of the banner image of this section on mobile ONLY? It looks fine on desktop, but on mobile, the banner image is rather tall (even taller than the hero slider above it).

I would appreciate any help with this. Thanks!

Screenshot (901)M.pngScreenshot (900)M.png

0 Likes
ahsaniub123
Shopify Partner
50 9 6

 

 

 

 

Did my answer work for you? Please drop a Like and Mark it as Accepted.
Want to develop/design/customize your theme Hire me.
Feel free to contact me at Email: ahsan.iub123@gmail.com | Skype: ahsaniub123 | Whatsapp: +92 3012 104 116.
Shopify Expert | Shopify Developer | Liquid Developer
0 Likes
JaySway
New Member
8 0 0
ahsaniub123
Shopify Partner
50 9 6

Hi again, 

login into your Shopify admin dashboard and navigate to Online Store > Themes > Actions > Edit Code

Search for the file smk-sections.css and open it

In this file add at the very bottom the below lines of code 

 

 

.smk-sections-above-content {
    margin-bottom: 0 !important;
}

 

 

 

Did my answer work for you? Please drop a Like and Mark it as Accepted.
Want to develop/design/customize your theme Hire me.
Feel free to contact me at Email: ahsan.iub123@gmail.com | Skype: ahsaniub123 | Whatsapp: +92 3012 104 116.
Shopify Expert | Shopify Developer | Liquid Developer
0 Likes
JaySway
New Member
8 0 0

Hi @ahsaniub123

Thanks for the assistance, however I'm afraid the proposed solution did not work (entirely). Here's what happened: After adding the code, I noticed the decreased space, however (1) it pushed some hero banners/images UP and BEHIND the header (thus, obscuring some of the content), and (2) some of the hero banners/images remained with the white space above, untouched. These issues I noticed on both desktop and mobile. Got any ideas about rectifying this? I appreciate your help.

0 Likes