我正在使用 Bootstrap 构建一个网站，但我不确定解决以下问题的最佳方法是什么。
我的导航栏左侧有一个大徽标，右侧有六个导航项目。在 XS 屏幕尺寸下，导航项正确地折叠到汉堡菜单中，但是在它们这样做之前，它们会漂浮在徽标下方，这不应该是正确的行为。
演示：尝试调整此网页的大小 -> http://stackoverflowquestion.bss.design
Stack Overflow 上类似问题的一个解决方案是简单地更改折叠宽度 - 但是我发现这不是最佳选择，因为不同的设备具有不同的高度/缩放，因此宽度不是通用的。
解决此问题的最佳做法是什么？谢谢
【问题讨论】：
标签： html css twitter-bootstrap navbar
最好的方法是在此处生成自定义引导程序http://getbootstrap.com/customize/ 并使用适当的媒体查询断点，您可以在那里编辑其他一些内容。 Bootstrap 标准宽度和其他参数只是一个基本骨架 - 您可以随时编辑它们。
编辑：其他解决方案 - 只需将徽标缩放到更小的尺寸 - 使其具有响应性（并使用最大宽度）。
Edit2：使用媒体查询缩小徽标容器 div（并保持徽标图像响应） - 使用该解决方案，您可以仅为较低分辨率（screen-xs）保留折叠菜单，并且 screen-lg/md 将保持未折叠.
【讨论】：
问题在于导航栏崩溃的断点。默认情况下，它设置为 XS 屏幕，即
您必须通过更改宽度将导航栏折叠断点设置为 sm 或 md 屏幕。我没有发现这种方法有任何问题。
或者，您可以使用媒体查询来使导航栏元素更小且响应更快。比如你可以让你的logo随着屏幕宽度的减小而变小，这样导航就可以适应了。
【讨论】：
您可以使用 css 来修复它。删除导航栏中的最大高度。
【讨论】：