Streaming live at 10am (PST)

Aligning standard nav link, dropdown and button in nav menu


#1

Everything is aligned until I drop in the button. Any thoughts what I need to fix the alignment?

https://preview.webflow.com/preview/lbx?preview=e33684a0a04faad6686879085d2218e4


#2

Hi @troyc, thanks for the great question. I took a quick peek, and it seems there is no styling applied on the Dropdowns, I would add a class to each dropdown and set to display inline block, with float left.

Take a look:

I hope this helps!


NavBar non-dropdown Link Formatting
#3

Better. Thank you! Still have a question and an issue.

Question: Should I apply the same style to the nav links or just the dropdowns?

Issue: When you click the dropdown, the dropdown list displays over the top of the dropdown. Is this just a margin adjustment?


#4

Hi @troyc, yes I would apply that same style to every sibiling element (dropdown, link, and button).

Regarding the drop down list that is covering the dropdown (and dropdown toggle), i would give each dropdown list a class and a top margin equal to the height of the navbar.

See my video:

I hope this helps!


#5

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