zurb foundation 6 topbar有助于创建自定义断点吗？

Question

我正在与Zurb Foundation 6合作，并且在导航项目方面，TopBar总是会出现两个独立（并且反复发生）的问题。

问题1

在第一个例子中，第一个问题是每当我在导航项中使用空格时，例如＆＃34; FOR SALE＆＃34;在扩展的导航菜单上，当浏览器的宽度减小时，单词堆叠在一起。

我尝试添加一个白色空间：nowrap;，当屏幕宽度减小时，悬停导航文本开始突破其容器。

以下是codepen上此问题的一个示例，将nowrap添加到css只调整浏览器宽度：

https://codepen.io/floridapctech1/pen/MvaKrQ

问题二

我似乎总是遇到的第二个问题是，如果我在屏幕左侧创建一个徽标，然后将我的导航放在右上角，只要浏览器的宽度减小，导航就会叠加在徽标，直到遇到断点。

这是这个codepen的链接：

https://codepen.io/floridapctech1/pen/ZJEZPd

我尝试在settings.scss文件中创建自定义断点，例如：

$breakpoints: (

  small: 0,
  tiny:460px,
  medium: 640px,
  custom: 950px,
  large: 1024px,
  xlarge: 1200px,
  xxlarge: 1440px,
);

$print-breakpoint: large;
$breakpoint-classes: (small tiny custom medium large);

...
...

// 37. Top Bar
...
$topbar-unstack-breakpoint: custom;
Then I modified the .title-bar and use the custom breakpoint like so:

.title-bar {
    @include breakpoint(custom) {
        width:950px;
    }
}

如果我使用＆＃34; hide-for-large＆＃34;等类。使用预定义的断点，这些工作正常。

似乎定义了一个＆＃34; custom＆＃34;大小，我应该能够在我的html中使用data-hide-for =＆＃34; custom＆＃34;，＆＃34; custom-dropdown＆＃34;等等，但这不起作用。< / p>

非常感谢任何建议和帮助。