Community forum for knowledge and support

Updated last year

How To Make The Dropdown-full Screen In Relume Navbar 4

At a glance

A community member is building a site using the Relume Navbar 4 component and is having trouble making the dropdown cover the entire screen with a dark green color as shown in a video. They have tried adjusting the div positioning but cannot find a solution. Another community member suggests that this will likely require custom CSS and offers to take a look at the published site. The community member shares the published URL and a video is recorded to help. After making some minor tweaks, the community member is able to get a working solution, but is not fully satisfied with the nav links being "masked off" when the nav closes, and believes they can fix this with some animation on the nav links.

Useful resources

I’m building a site using the Relume Navbar 4 component.
But I can’t figure out how to make the Dropdown-full screen.
It should cover the entire screen with the dark green shown in the video here:
https://share.cleanshot.com/WqXltHGj
I guess it’s something with the div positioning (static vs. relative vs. absolute) but I can’t figure out how to fix it.
Anyone knows about a quickfix for this issue?
Preview: https://preview.webflow.com/preview/frolic24?utm_medium=preview_link&utm_source=design[…]4&preview=ec1fe96ad6207e7d21802a46ea81e82d&workflow=preview

M
L
4 comments

can you share a published URL? This will likely require some custom CSS and I need to inspect the elements in order to give better direction on what that would be.

I shure can.
https://frolic24.webflow.io/
Thanks a lot for looking into this 🙌

Thanks a lot for the video . I did a bunch of minor teaks and ended up with this, which will work for now 🙂 I’m not too happy with the nav-links getting “masked off” when the nav closes, but I must be able to fix this with some animation on the nav links themselves.
https://frolic24.webflow.io/

Add a reply
Sign up and join the conversation on Slack