Docs

[PhilipAnker]

Hi There.

Here’s my URL:
http://www.lenebojer.dk

I’ve understood that you can simply adjust the transformation of the nav-bar with simple CSS code such as:

@media (max-width: “Wanted width”px){
.x-nav-wrap.desktop {
display: none;

However it only configures when adjusting it bigger than the default iPad-width at 979px. Basically my client wants the website to have a traditional nav-bar when in iPad-mode. I will be able to size down fonts and remove a link so there will be space for the whole menu in iPad-mode.

Is there a simple way adjusting the transform of the “Mobile Hamburger Menu” 760px instead of 979px, so the mobile nav-bar only is present when in iPhone-formats?

Sincerely
Philip

[Rue Nel]

Hello Philip,

Thanks for writing in! To display the desktop menu on the ipad, we need to add another custom css. please add the following css code in the customizer, Appearance > Customize > Custom > CSS

@media(min-width: 768px) {
    .masthead-inline .x-btn-navbar {
        display: none;
    }

    .x-nav-wrap.desktop {
        display: block;
    }

    .x-nav-wrap.mobile {
        display: none;
    }
}

Hope this helps.

[Author]

Posts