Docs

[zangove01]

Hi,

My website is http://fybmarine.stlouisbluesboutique.com/

I would like to change the menu around. I would like the overall backgroyund to remain white, however I would like the back ground in the little pill shaped area to be the same blue as the rest of the site. I would then like the writing to be white.

Can you please assist?

[Rue Nel]

Hello There,

Thanks for writing in! Do you want something like this?

If that’s the case, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

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

We would loved to know if this has work for you. Thank you.

[zangove01]

Thank you for the prompt reply. I was hoping to also try fixing the blue background so it is blue all the time along with the white writing?

Is this possible as well?

Thank you

[Lely]

Hi There,

Do you mean blue background for the submenu and white text for the submenu links? If yes, please use this:

.desktop .sub-menu {
    background-color: #84b8b4;
}
.x-navbar .desktop .sub-menu a{
    color: #ffffff;
}

If this is not what you want to achieve, please clarify so we can be specific on our suggestion.

[zangove01]

Hi,

No I would prefer the initial setup we had, with the buttons background blue regardless if you are hovering or not and then the writing blue.

If you can keep the submenu backgound white, with blue writing that would be good.

[Rupok]

Hi there,

You just need to change the color code :

.desktop .sub-menu {
    background-color: #ffffff; 
}
.x-navbar .desktop .sub-menu a{
    color: #84b8b4;
}

Let’s adjust them if needed.

Thanks!

[zangove01]

As I said previously. I would like all the menu buttons to permanently have the blue back ground with the white writing. not just when you hover.

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

.x-navbar .desktop .x-nav > li > a span {
    border-color: #84b8b4;
    background-color: #84b8b4;
    color: #fff;
}

Hope that helps.

[zangove01]

great thankyou

[Christian]

You’re welcome.

[Author]

Posts