Navbar background hover wrap around text

Support
#1

Hi guys,

I’m trying to adjust our navbar to do the following: on hover it now displays a rounded border wrapped around the menu-items in the navbar. I’m trying to add a background-color to this.

However, when I add a background color to my hover, it displays the color in the entire block, not within the borders of this text-wrap. I’ve tried adding a new border so I could add the background-color to this, but this also wraps around the entire menu-item block and not the text.

Been checking W3 and other forums for a while now, but I can’t seem to make it work. Could you help me out?

#2

Hi there,

Please update this code:

li a:hover:not(.active) {
    background-color: #cff09e;
}

to

li a:hover:not(.active) span {
    background-color: #cff09e;
}

Hope this helps.

#3

It’s perfect! Thank you!

#4

You’re welcome.

#5

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.