Display and positioning of dropdown menu

So I have this problem with the styling of my dropdown menu’s in my nav bar. This is my situation:
I have a nav bar with 5 items, 2 of which have a dropdown menu: ‘Health News’ and ‘About’. In the full screen version everything works as I want. However for the mobile menu, I want to have the dropdown menu’s appear to the right of the main menu, in order not to mess up the layout of the main menu.

Below is a screenshot of how the Health News dropdown looks in the designer view of Webflow. This is indeed what I envision.

However in the preview mode of Webflow, I don’t have any menu at all (not even the main menu appears)

(note that when the menu icon is blue in my design, the menu is in open state)

When I look at the website as published, this is the effect that I get:

The About dropdown does not even let me change its position in designer mode, no matter what I do (auto, relative, absolute, fixed, changing position values):

I have been working on this now all day, and getting frustrated :angry: I hope someone can help me figure this out.

Here is my public share link: https://preview.webflow.com/preview/liberia-health-beat?preview=3ed02a216df00849d64f1cc86bbc9cf0
Here is the published site: http://liberia-health-beat.webflow.io/

Ok, I never figured out why it didn’t work. I suspect it has something to do with the builtin dropdown menu’s that I was using. Anyway, as a solution, I build my own dropdown menu’s using div’s and now it all works perfectly. The only disadvantage is that you can’t open the menu’s in the builder with the ‘open menu’ button. You’ll have to unhide it yourself.

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