Archived topic
Dispatch / Mega-Menu Mix
6 replies · Started by blitzgeek on December 8, 2019
Hi there, i have a problem with a site in development.
It's about the hover for the main navigation and current-menu item, best seen below the "inform" topic.
In the mega-menu area the marking is confusing (says the customer), because the "ul-part" is marked below the "li-part".
Is it possible to underline the "ul" directly?
I hope I was able to clarify what I mean.
Best regards,
Volker
Hi there,
to help understand this, is the issue when hovering over the sub menu item the UL is underlined?
Eg. I hover over Mafia and the underline is below the UL....
Hi David, here is a screenshot, hope this helps.
https://blitzgeek.net/wp-content/uploads/dispatchmegamenu.jpg
Hmmm... complex one and correcting it may 'change' the other menu behaviour.
Try this CSS for the navigation stying instead:
@media (min-width: 769px) {
.main-navigation ul li {
position: relative;
}
.main-navigation ul > li > a:after {
content: '';
position: absolute;
height: 0;
width: 100%;
bottom: 0;
left: 0;
pointer-events: none;
filter: hue-rotation(90deg);
-webkit-filter: hue-rotation(90deg);
-webkit-transition: height 0.35s ease;
transition: height 0.35s ease;
background-color: red;
}
.main-navigation ul > li a:hover:after, .main-navigation ul li.current-menu-item a:after {
height: 6px;
}
}Thanks David - but nothing changed.
David!
i tried this one on a local site .. and it works!
So let me check what's different, i will keep you informed.
It was the order in the style.css.
I have placed the Mega Menu block above the navigation section and now it works.
Thank you very much!
You did a great job, as always. Now you can take a little more time with the Sections Block. ;-)
Cheers!
Awesome :) Glad to be of help
