How to Design a Dropdown menu that covers the Navlink

Design help Layout & Design
1

Hi,

I’ve added a photo to describe my intention best
Example

Thanks!

Here is my site Read-Only: [LINK]Webflow - EverBlue
(how to share your site Read-Only link)

2

Hey! Welcome to the forums! This is totally achievable.
If you select the dropdown, switch to the settings tab to show the dropdown, and then back to the style tab (whilst it’s open). Now select the Dropdown Toggle (notice how it now has a native combo class of “open”) and you’ll be able to style the trigger to look like the top of the dropdown. You’ll probably want to duplicate the “Nav Link 3” class for this instance and call it something else.

I managed to get there with your site by adding some top margin (e.g. 10px) on Nav Link 3 and reducing the padding by 10px or so. The box-shadow might take some experimentation if you realllly want to make it look like the image above but if you’re pragmatic, you can get a similar effect by simply adding a larger box shadow to just the dropdown list.

image
image1920×484 59.6 KB