Archived topic

Underline menu

5 replies · Started by Antal on August 29, 2019

Viewing posts 1–6 of 6

August 29, 2019 at 1:49 am #996097

Hi guys,
I have added an underline on the main menu. But now I am struggling to delete this underline from the dropdown menu items. Hope you can help me with this?

.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: 1.5px solid #ef5c1c;
    position: relative;
    top: -30px;
    opacity: 1;
}

Thanks a million! (I feel rather stupid not knowing CSS well ;-) )

August 29, 2019 at 3:18 am #996146

Hi there,

you can use the > Child Combinator in your CSS.
So change:

.main-nav ul to .main-nav > ul

then the CSS will only apply to UL's that are a direct child of the main nav.

August 29, 2019 at 4:29 am #996190

Hello David,
I have changed the CSS to

.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: 1.5px solid #ef5c1c;
    position: relative;
    top: -30px;
    opacity: 1;
}

But it is still the same?
The site I am working on is in maintenance mode, how can I send you the log in date so you can have a look?

August 29, 2019 at 4:49 am #996198

Sorry hadn't had my midday coffee lol

Try updating the selectors:

.main-nav > ul li to .main-nav > ul > li

August 29, 2019 at 4:54 am #996199

Yes, that did it. Thanks a lot Dave. :-)
Enjoy your coffee ;-)

August 29, 2019 at 4:55 am #996200

Having one of those weeks lol - glad to hear its working.

This archived topic is closed to new replies.

Start building better websites today.