我正在使用Bootstrap构建一个网站，我不确定解决以下问题的最佳方法是什么。
我的导航栏左侧有一个大徽标，右侧有六个导航项。在XS屏幕尺寸下，导航项正确地折叠成汉堡菜单，但是在它们这样做之前它们会漂浮在徽标下面，这不应该是正确的行为。
演示：尝试调整此网页的大小 - ＆gt; http://stackoverflowquestion.bss.design
Stack Overflow上类似问题的一个解决方案是简单地改变折叠宽度 - 但是我发现这不是最佳的，因为不同的设备具有不同的高度/缩放，因此宽度不是通用的。
解决此问题的最佳做法是什么？感谢
答案 0 :(得分：0)
最好的方法是在http://getbootstrap.com/customize/生成自定义引导程序，并使用正确的媒体查询断点，您可以在其中编辑其他几项内容。 Bootstrap标准宽度和其他参数只是一个基本框架 - 您可以随时编辑它们。
编辑：其他解决方案 - 只需将徽标缩放到较小尺寸 - 使其响应（并使用最大宽度）。
Edit2：使用媒体查询缩小徽标容器div（并保持徽标图像响应） - 使用该解决方案，您可以保留折叠菜单仅用于较低分辨率（screen-xs）和screen-lg / md将保持不折叠
答案 1 :(得分：0)
问题在于导航栏崩溃的断点。默认情况下，它被设置为XS屏幕，即＆lt; 768px。由于填充内容，navbar-collapse会在navbar-header下推送。
您必须通过更改宽度将导航栏折叠断点设置为sm或md屏幕。我还没有发现这种方法存在任何问题。
或者，您可以使用媒体查询使导航栏元素更小且响应更快。例如，您可以在屏幕宽度减小时使徽标变小，以便导航可以适应。
答案 2 :(得分：0)
您可以使用css来修复它。删除导航栏中的最大高度。