CSS-防止菜单中断到第二行

Question

当浏览器宽度约为1180时，菜单会中断到第二行。我该如何阻止它这样做？

http://goo.gl/5UpJSv

Answer 1

您需要将burger菜单的断点更改为1200px，或者您可以增加容器的宽度：

.container {
    max-width: 1140px;
}

Answer 2

这是因为断点将.contanerdiv-s宽度设置为970px。现在你有两个选择：

1. 将汉堡包菜单应用于此布局（而不仅仅是较低分辨率）
2. 稍微编辑一下结构：较小的边距，较小的填充，较小的字体大小

Answer 3

Hamburger菜单是您与按钮一起使用的菜单，用于在站点上断点达到1100px时显示导航。它之所以被称为汉堡菜单，是因为上面有三条水平线。

正如DNReNTi所说，你可以这样做，但为了保持你选择的布局，最好是，你可以更改断点，使其更宽容，或者应用以下样式更改：

.cap-header-fixed .menu > li, .cap-primary-menu .menu > li {
display:inline-block;
padding: 0 8px;
}

另外请注意，您已将菜单图标（汉堡菜单）设置为仅在@media屏幕上显示（显示：块；），并设置为（最大宽度：1100px）和（最小宽度：0px），将主菜单设置为在@mmedia上显示（最小宽度∶1100px）。将其更改为1101px，否则你会发现在1100px时，汉堡和桌面菜单都会显示。

希望这有帮助：）