Need help getting item to sit flush with other navbar items

Design help General
1

Hi all, I am editing a navbar designed by another designer.

Looking to get your help in getting this dropdown to fit in with the rest of the navbar items.

47
472028Ă—548 186 KB

https://preview.webflow.com/preview/rawlinsons-wa?utm_source=rawlinsons-wa&preview=59d3488a6bd77b2bd2321f999eeb6440

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

2

Hi Dylan,

I was able to make it work by doing two things inside the Navbar symbol:

  1. Change the Nav Menu container to Flex, horizontal, justify center and align center
  2. Adjust the Dropdown Toggle container right padding to zero

I hope this helps!

1 Like
3

Thanks Matt, I will try that now!

4

It worked! Thanks!

One more question - how do I make this not span out so far?

47
472130Ă—558 189 KB

5

Hey Dylan,

This is just one suggestion…others might have a better way to do it. I was able to adjust what you are asking about by:

  1. Inside the Navbar symbol, open the elements settings for the “Dropdown Toggle” item, then Open Menu so you can see the stretched menu item spans
  2. Select the first “Dropdown Item”, and set the width manually to something like 240px, then change the left margin to zero. All the other dropdown items will change since they have the same class
  3. Select the dropdown list container, change the background color to transparent

Note: I only tested this on the full screen view, not on tablet or mobile

I hope that helps!