Hi everyone,
I’m stuck… in my nav on the tablet setting, I have a few dropdown menus. One is performing correctly (the items are centered under the dropdown, but two are off center… but they all seem to have the same settings. What am I doing wrong??
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
Any suggestions on this? 
Hey @Tanya_Sillitti,
So the issue is widths on your elements, which in this scenario you have three types of:
The top level dropdown has no width property:
Dropdown Toggle does:
Dropdown List/Link does not:
What’s happening is the toggle (blue) is fitting to 600px but the list and links are expanding to the width available based on the container.
See the blue outline around the container lining up with the edges of the items?
You either need to have no widths and let everything expand or set a width on everything so that they all align.
I would probably just put a max width on the exterior nav element on tablet:
It will also help to remove the random classes on the nav elements (just one class for a dropdown and one class for a link) like this:
That will make this much easier to style consistently since you’ll only have a single class to deal with for each item rather than trying to make a bunch of different classes all the same.
