Archived topic

Trigger menu item with custom class

3 replies · Started by Manuel on January 31, 2019

Viewing posts 1–4 of 4

January 31, 2019 at 4:10 am #797449

Hey Guys,

i've added a class to one menu item and now i want to underline this item only on hover or active.
My class is: my-hover
The code

.main-navigation .main-nav .my-hover ul li[class*="current-menu-"] > a {
	border-bottom: 1px solid red;
}

and

.main-navigation .main-nav .my-hover ul li:hover > a, 
.main-navigation .main-nav .my-hover ul li:focus > a,
.main-navigation .main-nav .my-hover ul li.sfHover > a {
	border-bottom: 1px solid red;
}

Whats wrong with the code?

Thanks in advanced and best regards.

January 31, 2019 at 8:32 am #797791

Hi there,

Try this instead:

.main-navigation .main-nav ul li[class*="current-menu-"].my-hover > a,
.main-navigation .main-nav ul li.my-hover:hover > a, 
.main-navigation .main-nav ul li.my-hover:focus > a,
.main-navigation .main-nav ul li.my-hover.sfHover > a {
    border-bottom: 1px solid red;
}

January 31, 2019 at 8:40 am #797799

Perfect, Works.

Thanks a lot again!

January 31, 2019 at 8:49 am #797817

You're welcome :)

This archived topic is closed to new replies.

Start building better websites today.