Remove underline sub-menu

Hi there,

Not sure what CSS you are using but I'd recommend trying this:

.main-navigation .main-nav > ul > li > a {
    border-bottom: 1px solid transparent;
}
.main-navigation .main-nav > ul > li > a:hover {
    border-bottom: 1px solid #000;
}

Let me know if this helps.

The css is :
.main-navigation .main-nav ul li[class*="current-menu-"] > a:after,
.main-navigation .main-nav ul li:hover > a:after,
.main-navigation .main-nav ul li.sfHover:hover > a:after {
content: "";
display: block;
width: 100%;
border-bottom: 3.5px solid #007310;
position: relative;
top: -10px;
opacity: 1;
}

Thanks

Have you tried mine? I think it should work better.

If you still like yours then just make sure to add the ">" in the selector like I did.

Your code is better. But underlining I just want you to cover the text.
Thank you.

Ah ok then just try adding ">" in your selectors like I did with mine.

Let me know if this helps.

Hello ,

This code does not show underlining.

.main-navigation .main-nav > ul > li[class*=”current-menu-“] > a:after,
.main-navigation .main-nav > ul > li:hover > a:after,
.main-navigation .main-nav > ul > li.sfHover:hover > a:after {
content: “”;
display: block;
width: 100%;
border-bottom: 3.5px solid #007310;
position: relative;
top: -10px;
opacity: 1;
}

Hmm can you apply it so I can see why it's not working?