Remove gap between header and menu on Mobile

Hey there vardaaberbach,

How are you doing today!

This should be possible with adding some custom CSS and using media queries. Please try adding the following CSS code to your child theme style.css:

@media screen and (max-width: 767px) {
#header-content {
padding: 0.5em 0;
}
}

This should reduce the header on smaller resolutions. Please let me know if this helps ??

Cheers,
Bojan

Hey Bojan,

Thank you for your help, but it didn’t solve the problem.
I removed the header image and still had a big gap. It might have to do with some menu padding or something else that I couldn’t figure out.
I’d be happy to know if you have another idea.

Thank you so much!

Varda

Hey there Varda,

Not sure which header image are you referring to, the logo? What I did there is reduced the padding on smaller resolutions so the the logo fits better into the header, this should be the outcome https://screencast.com/t/yNPt4BdCaf4.

Did you remove the code now? If yes could you please add it again so I can take a look and see what’s wrong.

Best regards,
Bojan

Hi Bojan,

This is a miracle !!! This time it worked!! I don’t know what went wrong before. Your code did the trick!
Just out of curiosity, what did you do in order to correctly display gce.co.il?
Thank you so much!

Varda

Hey there Varda,

Glad I could help ??

I reduced top/bottom padding that was being applied on the header. I also put that in media query so it affects only resolutions below 767px which was the breaking point where your logo became smaller.

Hope this makes sense.

Best regards,
Bojan

Hey there Varda,

Glad I could help ??

I reduced top/bottom padding that was being applied on the header. I also put that in media query so it affects only resolutions below 767px which was the breaking point where your logo became smaller.

Hope this makes sense.

Best regards,
Bojan

Hey there Varda,

Glad I could help ??

I reduced top/bottom padding that was being applied on the header. I also put that in media query so it affects only resolutions below 767px which was the breaking point where your logo became smaller.

Hope this makes sense.

Best regards,
Bojan

Hey there Varda,

Glad I could help ??

I reduced top/bottom padding that was being applied on the header. I also put that in media query so it affects only resolutions below 767px which was the breaking point where your logo became smaller.

Hope this makes sense.

Best regards,
Bojan

Hey there Varda,

Glad I could help ??

I reduced top/bottom padding that was being applied on the header. I also put that in media query so it affects only resolutions below 767px which was the breaking point where your logo became smaller.

Hope this makes sense.

Best regards,
Bojan

Hey there Varda,

Glad I could help ??

I reduced top/bottom padding that was being applied on the header. I also put that in media query so it affects only resolutions below 767px which was the breaking point where your logo became smaller.

Hope this makes sense.

Best regards,
Bojan

Hey Bojan,

Thank you so much for your help!

Varda