I have a main page with dropdown menus when you move mouse over them.
But now on small screens, like mobiles, the dropdown does not work well as it completely covers the other main menu buttons (now stacked on top of each other)
I try to move the dropdown container more to the r/h side, but on the preview and published it stays put.to the l/h side and mews with my main menu buttons
I try to change the mouse over to "click" only, but then it changes all the other screen sizes as well.
Am I missing something here? Can styles not differ at various breakpoints?

To be able to help we need to see your project file. Please zip it up and pop it into your dropbox and post the link here.

you can view it on www.go2places.com/vineyardvarieties
file link will follow

link to project file
https://drive.google.com/file/d/0B5LMKp … sp=sharing

I don't have a lot of time to investigate, but what are you using as a source, if anything for this navigation menu?

It certainly does not look at all structured like Foundation 6 would suggest it should. I don't think you have one list or unordered list item. Lists for menus is a standard way of creating navigation, with or without dropdowns. Some of these menus are tricky, be sure to consider the List Item Container element - it will insert a <ul> populated with <li>'s of links. I am thinking you need to rebuild all of this.

http://foundation.zurb.com/scalingsexiness/sites/docs/dropdown-menu.html

I just used a sample component with a dropdown, removed the contents of the container and added text links instead

I think I figured it out. The component was published incorrectly I believe. The container for the dropdown in mobile view should have a fixed positioning. It does not and causes that space to appear. I am not quite sure why because the drop down menu should be straight forward.


Also, that text is extremely small for mobile, it should be at least 16px (1 em) and for touch targets you will want space about that 1 em also for usability. Overall though, I think you should use a traditional toggle menu that collapses into a hamburger icon. An off-canvas menu that slides in on a tough target might be neat also.