[Resolved] Sub Menu Level 1 – Line or Border on Items

[Michael]

Hi guys,

For some reason I have a line beneath my sub menu items on the products dropdown:

https://www.dropbox.com/s/hcuy3zqdz9cjb9y/menu-line.jpg?dl=0

I’d like to make it look like the second sub-menu as per this (which doesn’t have the same line – only happens on 1st sub menu items not the 2nd sub menu):

https://www.dropbox.com/s/0ylmcbq5l2z2b37/sub-menu-no-line.jpg?dl=0

I’m not sure how best to address that? I don’t see any borders in the css for .main-navigation .main-nav ul ul li[class*="current-menu-"] > a:hover. Am I looking at the wrong class? Any advice would be much appreciated 🙂

Michael.

[Leo]

Hi there,

Have you fixed this?

I no longer see the issue:
https://www.screencast.com/t/oAOBqOraxSu
Let me know 🙂

[Michael]

Hi Leo,

No, I haven’t fixed it. What seems to be happening is that if I click a menu in the first sub menu, it remains highlighted so that when I go back to the menu the lines appear:

https://www.screencast.com/t/vzTtYhpI0NzF

[Tom]

Hi there,

Try this CSS:

.menu-item-has-children .dropdown-menu-toggle {
    line-height: 0;
}

Let me know 🙂

[Michael]

Tom, you are a legend – it works perfectly. Thank you 🙂

[Tom]

You’re welcome 🙂

[Author]

Posts