Mega menu spacing on sticky menu

Hi, i’ve been very confused for the past 30 min trying to figure out why a weird spacing appear on mega menu whenever the menu is on a “Sticky” state, the only i could see would be a setting a missed or something like this ? (normally the html block in the megamenu as -15% padding on top, maybe it get removed ?) but i’m very confused

i can’t send a video but here’s 2 pictures and the link to test it out

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Custom CSS for desktop:

.whb-sticked .whb-general-header .wd-dropdown:not(.sub-sub-menu) {
    margin-top: 0px !important;
}

Best Regards,

[Evann .A]

Hi there,
Sorry for the delay, but i just noticed an issue that i didn’t in the past.

After adding the css, when the header is sticky, the menu button doesn’t work anymore, but it does when the button is not in a fixed position.

• This reply was modified 1 week, 1 day ago by Evann .A.
• This reply was modified 1 week, 1 day ago by Evann .A.

Hello,

I have checked your site and the menu button is working fine and the mega menu spacing is not showing on the sticky header.

See Screenshot for clarification: https://postimg.cc/3WSGNY2n

If you have any questions feel free to contact us.

Best Regards,

[Evann .A]

Hi,
My issue is that when the HTML block dropdown menu is open (And sticky, it works fined when fixed),
i am unable to click on any other button in my menu.

i added a video below and a few screenshot.
it looks like a weird Z-index issue but i’m not sure

• This reply was modified 1 week, 1 day ago by Evann .A.

Attachments:

You must be logged in to view attached files.

[Evann .A]

The video is too large, but i added a loom video link into extra information

The issue occurs only when the dropdown menu is open and the main menu is sticky (it works fine when the menu is fixed).

When a submenu is open, I’m unable to click on any other buttons in the navigation menu.
It seems like it might be related to a z-index conflict, but I’m not entirely sure (but it’s 100% related to the css).

• This reply was modified 1 week, 1 day ago by Evann .A.

Hello,

Please try to remove the previous code and add the following one and check the issue.

.whb-sticked .whb-general-header {
  position: relative;
  z-index: 1100; /* moderate value — header stays interactive */
}
.whb-sticked .whb-general-header .wd-dropdown:not(.sub-sub-menu) {
  margin-top: 0 !important;
  top: 100% !important;       /* place dropdown directly under header */
  transform: none !important; /* cancel any transform-based offsets */
}
.whb-sticked .whb-general-header .wd-dropdown:not(.sub-sub-menu):after {
  height: 0 !important;
  pointer-events: none !important; /* allow clicks through this pseudo area */
  display: block;
}

Best Regards,

[Author]

Posts