Docs

[Matt W]

Using ICON stack.

I’d like the highlighted menu item to not just have an oval around it, but also a color filling it in.

Image shows what it is, and then what i want to do.

Thanks

[Prasant Rai]

Hello Matt,

Thanks for writing in!

You can add this under Custom > CSS in the Customizer:

.x-navbar-fixed-top-active .x-navbar .desktop .x-nav>li>a>span:hover {
    border: 0;
    background-color: #cd1c7a;
}

.x-navbar .desktop .x-nav > li > a:hover {
    color: #fff;
}

Thanks.

[Matt W]

Could you please provide the code to keep the background color on after it has been selected?

Thanks!

[Matt W]

Also, just noticed that with this code added, when i hover around it, the menu item turns completely white…

[Matt W]

Here is the image

[Friech]

Hi There,

Are you working on a local server? Would you mind providing us the site URL so we can take a closer look. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Try this custom CSS for now.

header .x-navbar .desktop .x-nav>.x-active>a>span,
header .x-navbar .desktop .x-nav>.current-menu-item>a>span,
header .x-navbar .desktop .x-nav>li>a:hover>span {
    background-color: #ce1c7a;
    color: #fff;
}

Thanks.

[Author]

Posts