Docs

[macayla]

Hello,

I’d like to center the navbar menu, but only on one page. I am using

.page-id-2 .x-navbar .x-brand {
display: none;
}

to hide the logo on my home page, and I’d like the menu to be centered.
url, http://www.sattvadubuque.com

thanks in advance,

[Rue Nel]

Hi There,

Thanks for writing in! To center the navbar menu in your homepage, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.page-id-2 .masthead-inline .desktop .x-nav {
    display: block;
    float: none;    
}

.page-id-2 .masthead-inline {
    text-align: center;
    display: block;
    margin: 0 auto;
    width: auto;
}

.page-id-2 .masthead-inline .x-nav-wrap.desktop {
    display: inline-block;
}

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

[macayla]

Yes! Thank you! The only problem is that now the menu doesn’t disappear when the screen size shrinks. The collapsible menu appears, but the menu doesn’t disappear.

[Christopher]

Hi there,

Please update this code :

.page-id-2 .masthead-inline .x-nav-wrap.desktop {
    display: inline-block;
}

To :

@media (min-width:979px){
.page-id-2 .masthead-inline .x-nav-wrap.desktop {
    display: inline-block;
}
}

Hope it helps.

[macayla]

Yes! Thank you 🙂

[Joao]

You are welcome 🙂

Let us know if you need help with anything else.

Joao

[Author]

Posts