Reduce a blank space bellow the header (Narrative)

Solved
Highlighted
Tourist
16 0 1

Hello everybody!

My template is Narrative.
I've been trying to reduce the blank space between my header and my main content. It has happened on desktop and mobile. 
Someone could give me a light on that? Thank You! : )

Mobile:

IMG_9312.PNG   



IMG_9311.PNG

  



Desktop:

Screen Shot 2020-10-23 at 10.26.58 AM.png



 
 
 
 
 
0 Likes
Highlighted

Hello.....
Please share your store URL .
So that I will check and let you know the exact solution here.

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
16 0 1

Hello, friend!

singapurastore.com

password: iabrah

Thank You!

0 Likes
Highlighted
Shopify Partner
3182 701 847

@lucasverissimo 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

.section-header {
    padding: 20px 0 !important;
}
@media only screen and (min-width: 750px){
.section-header {  padding: 20px 0 !important; }
}

 

Hope this helps.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Tourist
16 0 1

Thank you so much, friend! It worked fine both desktop and mobile. 

Just one thing: when I scroll down and after that scroll to the top again, the images are getting cut.
Do you have an idea why is that happening?

(it's happening just in the desktop version)

Thanks! 

Photos to show you the bug:

Screen Shot 2020-10-23 at 7.33.27 PM.png



0 Likes
Highlighted
Shopify Partner
3182 701 847

This is an accepted solution.

@lucasverissimo 

Remove old code and use this new one.

.section-header {
    padding: 30px 0 !important;
}
@media only screen and (min-width: 750px){
.section-header {  padding: 30px 0 !important; }
}

 

Hope this works.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
Highlighted
Tourist
16 0 1

Worked! Thanks!

Highlighted
Tourist
34 0 16

Hello dmwwebartisan!

This solution doesn't work for me. Can you help me with another code please?

My site is https://genuinner.myshopify.com/ pass Innergenu.

IMG_4117.jpeg

 

Thanks in advance

Mp

Highlighted
Shopify Partner
3182 701 847

@Genuinner 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

.site-header{
height: auto !important;
}

 

Hope this helps.

Thanks! 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
Highlighted
Tourist
34 0 16

Yesss! It works!!! 

Thanks you so much @dmwwebartisan !!!

You are great and thanks for your quick reply!

Mp