Hide secondary menu on mobile / small resolution

[douglance]

My secondary menu shows up in the mobile view and is entirely useless at that resolution. I’d prefer to remove it or move it.

I think I need to add a new class for just the secondary menu and then use CSS to move it around.

I need a bit of assistance to get that done properly. Thanks.

[Cosmin – SUPPORT]

Hi,

If you want to hide the menu at the top, before the social icons on mobile devices, add this custom CSS in the theme options:

@media screen and (max-width: 320px) {

.visible-phone {
    display: none !important;
}

}

That will stop it from showing on all screens that are 320px or less in width. Adjust as needed.

Regards,

————————————————————————————————————

Cosmin
Support Assistant

[aliossi]

Hello,

is it any possible to turn off the top menu bar only for mobile? The code mentionend above behaves somehow strange. I have used the code, but deleted it afterwards. After that, i reused the code and this time disappeared both the main and the secondary menu. That occurs only in portrait format and doesnt work at all in landscape

[Ben – SUPPORT]

Are you looking to hide the top navigation, the grey one

and continue to show the black one?

Thanks
Ben

[aliossi]

Wich black one? But exactly, The only thing i try to do is to hide the top menu above the logo for mobile-phones and to show only the main menu which located underneath the logo.

thx

[Ben – SUPPORT]

I assumed so 🙂

 
@media screen and (max-width: 320px) {

#top-bar .visible-phone {
    display: none !important;
}

}

Will sort it out

Thanks
Ben