Finance Main Menu cutting off extra header widget


#1

Hi, we wanted to know how we may be able to remove the extra space that sometimes shows up above the main navigation menu (please see screenshot below). It is blocking and cutting off the green extra header widget.

If I scroll down and then scroll all the way back up it disappears, but we would prefer if the menu didn’t cut off the widget at any moment.

Website URL: http://1nt.720.myftpupload.com/promotions-2/

We appreciate your help with this.

Thank you,
German


#2

Hi,

I’ve just checked your site. Looks like the space is generated automatically from a javascript code on your site or maybe from your plugins.

Please try to disable your plugin one by one to make sure from where the issue is caused.
Or if you can’t find it, you can apply this CSS code below to fix it:

.site-header {
    top: 0 !important;
}

Regards,
Awan


#3

Hi Awan, thank you for your help. I have tried deactivating all plugins one by one and found no change. I also tried applying the code you provided and got the result in the screenshot below.

Please share any code we may be able to use to keep the menu from overlapping the slider or the top contact info bar.

Thank you,
German


#4

Hi,

Please try this:

.sydney-hero-area {
    top: 145px;
}

#5

It doesn’t overlap the top contact info bar but it covers the extra widget on the top of the other pages. Please see the screenshot below.


#6

Hi,

Looks like the white space at the top is added automatically. Below is the CSS code to fix it and here is also the CSS code to downward the header widget in big screen, Please try it:

@media (min-width: 1200px){
  .site-header{
    top: 0 !important;
  }
  .header-widgets {
    margin-top: 35px;
 }
}

#7

Hi Awan, thank you for your support. I have added the CSS code provided but the bar now overlaps the top contact info and also creates a blue bar between the menu and the slider image, as well as right below the slider image.

Regards,
German



#8

I see… let’s try to make the last code in above to not working in the home page. Replace this code:

@media (min-width: 1200px){
  .site-header{
    top: 0 !important;
  }
  .header-widgets {
    margin-top: 35px;
 }
}

With this:

@media (min-width: 1200px){
  .site-header{
    top: 0 !important;
  }
  body:not(.home) .header-widgets {
    margin-top: 35px;
 }
}