[Resolved] Disable / Hide Secondary menu on mobile only

[Benny]

I would like to be able to totally hide the secondary menu on mobile devices.
I have merged the topbar with the secondary menu. It looks stellar on desktop.
However, I do not want 2 menus on mobile. And I would like to hide the topbar too.

So, I have the topbar with a secondary menu on desktop.
On Mobile I would like to hide the topbar widget and the secondary menu.

[David]

Hi there,

try this CSS:

@media (max-width: 768px) {
    .secondary-navigation .menu-toggle {
        display: none;
    }
    .secondary-nav-aligned-right .secondary-navigation .top-bar {
        position: static;
    }
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Benny]

Thanks. The secondary menu part disappeared. However, the widget in the topbar is still saying hello.

I

[David]

Aah sorry i misunderstood.
Remove that CSS.
And add this instead:

@media (max-width: 768px) {
    #secondary-navigation {
        display: none;
    }
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Benny]

Worked like a charm

[David]

Glad to hear that!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts