Streaming live at 10am (PST)

Menu issues hamburger menu


#1

I am having some issues with my menu. It's not working correctly when trying to open the menu since it doesn't fold out. What am I doing wrong here?

Other than that I have a question regarding the formatting of the menu itself. I would like to have the active page show a Bold link (home for e.g.) and the rest should be a bit washed out indicating that those pages are not where you are at the moment. Can anybody help me out with this?

Thanks!
Daniel

https://preview.webflow.com/preview/blue-office-battery?preview=f057c7c6c517f0ff59309a20b492184c


#2

Hey @daniel_volle_maan,

I'm not sure what's going on with your menu and why it's closing right after you open it...

Your menu button is not visible as you gave the "smartmenu" element a z-indez of 1, and the "Menubutton" has a z-index of zero. increase this last one and you'll see the badboy again!

Regarding customising the active links, it's easy and all done in the CSS.
Just go on a particular page and select the corresponding menu item. It should be marked as "Current" in the Selector (see screenshot). From there you can style it.

Cheers


#3

Thanks for having a look:) I tried the Z-index...changed the menu buttons to z-index 5 but doesn't make a change...Regarding the active menu button, thanks for your explanation, I got that fixed!


#4

Hey @daniel_volle_maan!

Well, after a while looking through this I finally worked it out!

You have put your menu button INSIDE your brand button, this means you open the menu but also are clicking the home button (brand).
You probably did this in an attempt to put the hamburger button on the left.
However, that's caused the issue.

The way to change the order of the items within your navigation bar is to use Flexbox!!

I did a quick screen record here - I hope it shows clearly what I did to fix it.

Great game here to help you understand Flexbox if you have not used before - it will change the way you work


#5

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.