How to change underline color on navbar

Support
#1

The underline on my navbar menu is currently matching my nav bar background. I’d like it to be a different color so it will show up. I couldn’t find this setting anywhere in the customization options. Please help!

#2

Hello @StacieB,

Thanks for asking. :slight_smile:

You can add following CSS under X > Launch > Options > CSS to change navigation underline color:

.x-navbar .desktop .x-nav > li > a:hover > span, .x-navbar .desktop .x-nav > li.x-active > a > span, .x-navbar .desktop .x-nav > li.current-menu-item > a > span {box-shadow: 0 2px 0 0 #ddd !important;}

Thanks.

#3

Thank you but unfortunately, that only added a line under the text instead of on the bottom of the menu box.

#4

Hi There,

See this please: https://screencast-o-matic.com/watch/cFVehZonzQ

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {

    box-shadow: inset 0 -4px 0 0 green; /*Change green to your preferred color*/
}

Hope this helps.

#5

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