Menu icon Foundation
Top Bar is not responsive - even on the Foundation demo page

I've been thinking about moving from Bootstrap to Foundation and I've been experimenting a little.

I've found what seems to me to be a major bug with the Top Bar navigation component. It only works on large or very small screens - intermediate screens cause elements to float underneath each other.

It's fine on a mobile screen in both portrait and landscape, where it minimises to a small form menu with icon, but it's not fine in these situations:

- PC with a small browser window.
- iPad mini in portrait mode
- Nexus 7 in landscape mode.

It should be full width and either fully fleshed out or minimised, no? I provide images to show the problem.

Pc

PC screen

Nexus7

Nexus 7

Ipad

iPad Mini

csstop barnavResponsive

I've been thinking about moving from Bootstrap to Foundation and I've been experimenting a little.

I've found what seems to me to be a major bug with the Top Bar navigation component. It only works on large or very small screens - intermediate screens cause elements to float underneath each other.

It's fine on a mobile screen in both portrait and landscape, where it minimises to a small form menu with icon, but it's not fine in these situations:

- PC with a small browser window.
- iPad mini in portrait mode
- Nexus 7 in landscape mode.

It should be full width and either fully fleshed out or minimised, no? I provide images to show the problem.

Pc

PC screen

Nexus7

Nexus 7

Ipad

iPad Mini

Sub Jeff almost 5 years ago

How does spam like this even happen? lol

Rob almost 5 years ago

That is not a bug. It is a demonstration of adding a form to the nav. The top-bar breakpoint can be changed to have it break sooner to avoid stacking.

Wing-Hou Chan almost 5 years ago

Yep, what Rob said is true! This is not a bug but in fact due to the content of the top-bar being wider than the breakpoint.

You are able to change the breakpoint of the top-bar and here is a list of threads about that: http://foundation.zurb.com/forum/posts?utf8=%E2%9C%93&search=topbar+breakpoint&button=