Seeing a weird behavior when the dropdown menu items have sub-menus. When the dropdown menu is set to show under the menu label and has sub-menu items, the sub-menu items that draw above the header bottom are not recognized as hoverable. The dropdown menu itself works fine, but the sub-menu disappears very quickly if you don't hover on items below the header. You can see it in the related website.
This behavior is fixed when I tell the dropdown menu to draw below the header.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
#top nav>ul.sf-menu>li {
z-index: auto !important;
}
Hi,
Seeing a weird behavior when the dropdown menu items have sub-menus. When the dropdown menu is set to show under the menu label and has sub-menu items, the sub-menu items that draw above the header bottom are not recognized as hoverable. The dropdown menu itself works fine, but the sub-menu disappears very quickly if you don't hover on items below the header. You can see it in the related website.
This behavior is fixed when I tell the dropdown menu to draw below the header.
Hey Again,
You seem to have an Optimization plugin which could be causing this. Could you turn it off and check .
Thanks.
ThemeNectar Support Team
Hello there,
Thank you for reaching out to us.
Try clearing your cache and disabling any auto optimize plugins that you have installed and let us know how that solves the issue.
We look forward to your reply.
Thanks,
The performance plugin has been disabled. Still seeing the issue. I'll leave it disabled for now so you can see it as well.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.sf-menu .sfHover>ul, .sf-menu li:hover>ul { z-index: 9999 !important; }Thanks
ThemeNectar Support Team
I added this in the Custom CSS but I'm not seeing any change in behavior and I'm not seeing any red cross.
Hey Again,
The dropdown is no longer getting hidden when i move the cursor in the red area here:
Thanks.
ThemeNectar Support Team
If you hover to the right of heating, or open it's sub-menu, can you click on Furnace Installation?
Hey Again,
No, I couldnt.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
#top nav>ul.sf-menu>li { z-index: auto !important; }Thanks
ThemeNectar Support Team
That did the trick! Thank you!