Mobile Logo – Space Above

Hey Mike,

It is your .site-header. If I inspect the element, you have css code that’s creating the issue on the mobile:

.site-header {
    padding-top: 74px;
}

Also the size of your logo is too high on the mobile, in my opinion (based on the alignment of the hamburger menu). So fixing the css and resize your logo for mobile will fix the issue IMO.

Extra information:

BTW, I see that this css code is also implemented via the customizer or by a cache program? I can find the code in the source code of your website as well.

• This reply was modified 2 years, 12 months ago by Miguel.

Hi Miguel, thanks so much for the info.

Apologies as I’m not overly technical with CSS.

Having a look into it all now.

Cheers.

Mike.

If you don’t have added css code via the customizer yet, than it is your caching plugin that’s making the issue. Than I should fix it to put the following css code in the customizer:

@media only screen and (max-width: 600px) {
.site-header {
    padding-top: 10px;  (<--- FILL IN WHAT WORKS FOR YOU)
}
}

I cannot help you further atm because your site is in maintenance mode.

• This reply was modified 2 years, 12 months ago by Miguel.

Thanks Miguel. Much appreciated.

yes, I’ve put maintenance mode on until I get it all sorted.

Really appreciate your help with the CSS. Thanks.

Mike

Hi Mike,

Have you managed to fix the CSS issue?

Have a nice day,
Tom

Hi Tom.

I’ve changed themes in the end and gone back to one that I’m a bit more used to.

Thanks for all of your help though.

Mike.

Thanks for the heads up.

Best,
Tom