[Daniel HollandsParticipant]

Hi guys,

I want to hide the whole navbar on mobile but keep it all normal on desktop. I am using the Superfly menu for mobile/tablet devices. Ive tried a bunch of the CSS from other forum posts but it either only removes the text menu items (not the navbar with logo etc) or it removes the entire navbar from both desktop and mobile.

[LelyModerator]

Hi There,

There’s an option for that in Superfly. See attached screenshot.

[Daniel HollandsParticipant]

Hi Lely,

No sorry, I might not have explained myself right, Ive setup Superfly how I want it shows on Mobile but I hide it on desktop.

Now I want to HIDE the main menu on mobile, so its ONLY displaying on desktops. I can’t use the following code as it hides it across both desktop and mobile.

.x-navbar {
display: none;
}

Attached is the screenshot on mobile, you can see the super fly menu up the top, which I want to keep, but the normal menu below that, which I want to delete. Ive also included a screenshot of the site on desktop so you can see the main menu.

Let me know if you need any more details.

[LelyModerator]

Hi There,

Thank you for the clarification. Please use this custom CSS instead:

@media (max-width: 979px){
.x-btn-navbar,
.x-brand {
    display: none;
}
}

Hope this helps.

[Daniel HollandsParticipant]

Hi Lely,

Nah that just got rid of the logo, still have the bar with the hamburger menu there on the right, Ive attached 2 screenshots showing it. Anything else I can do?

[Daniel HollandsParticipant]

This reply has been marked as private.

[FriechModerator]

Hi There,

You can add this instead.

@media (max-width:  979px) {
	.x-navbar {
		display: none;
	}
}

Provide us the site URL if this does not work.

Thanks.

[Daniel HollandsParticipant]

Perfect, worked like a treat, thanks Friech

[FriechModerator]

You’re more than welcome, glad we could help.

Cheers!

[Author]

Posts