Menu too tall on mobile

Hi Kharis

I love your theme! I’ve just moved a website over from http://sohoproperty.ibuildwebsites.com.au to http://sohoproperty.com.au

I’ve duplicated everything including all CSS, header PHP, all customisation options and header height but there appears to be a big gap above the logo on the mobile site on http://sohoproperty.com.au that I can’t work out. The only difference between the two sites is that the new site is running the latest theme version.

Can you please have a quick look for me and let me know why this might be? I’ve tried everything!

Http://sohoproperty.com.au

Is there a way I can send you logins privately?

Thanks so much
Elley

Hello Elley,

Thank you for choosing Sydney.

To fix it, please add this CSS code into Appearance > Customize > Additional CSS in your site dashboard and let me know how it goes.


@media only screen and (max-width:1024px) {
  .header-clone {
    height: 0px !important;
  }
}  

Regards,
Kharis

Hi Kharis,

It didnt work :frowning: What could be causing this? The site is exactly the same as http://sohoproperty.ibuildwebsites.com.au and it isnt happening over there?

Kind regards,

Elley

Hi Elley,

I found the code inserted improperly.

Please replace this:


/*
You can add your own CSS here.

@media only screen and (max-width:1024px) {
.header-clone {
height: 0px !important;
}
}  

Click the help icon above to learn more.
*/	

with:


@media only screen and (max-width:1024px) {
  .header-clone {
    height: 0px !important;
  }
}  


Let me know how it goes.

Regards,
Kharis

You’re a genius Kharis! Thank you thank you thank you!

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis

Hi
I have a similar problem.
I would like to size of my header to be reduced especially on mobile.
I have been editing Sydney: custom-header.php and reduced header height to 600px which looks suitable for my website. But this only changes header size on the home page. Not sure why.
My website is http://www.intheair.com.au.
Is there any code which I can implement which can reduce the size of the header to 600px on all of my pages.
Thanks Eamon

Hello Eamon,

You can limit the maximum height of the main slider by adding this CSS code into Appearance > Customize > Additional CSS in your site dashboard.


.header-slider {
  max-height: 600px;
}

Regards,
Kharis