So I have a css only menu and sub menu. Standard UL / LI set up, and all of the list items have a sub list to them.
my CSS has the following
#mainnav li ul {
display: none;
}
#mainnav li:hover ul {
display: inline-block;
text-align: right;
z-index: 999;
width: 960px;
}
Okay works great. BUT Now if i hover over a second main nav, not only do i have the current subnav open, but i also have the new hover nav hanging open. resulting in a pile of links overlaying onto each other.
How can i have the open nav hide on hover of other top level items? This is in wordpress, so i can classes for .current-menu-parent etc.
