Twitter bootstrap 引导导航栏折叠菜单扩展到高度较小的设备的纵向模式下的视图之外

当在iPhone（或任何带有小屏幕的设备）上以横向模式观看时，引导下拉菜单超出了设备的高度，我遇到了麻烦。滚动条会显示出来，但它离屏幕太远，在滚动中没有任何用处

例如：

请让我知道我是否也应该将此作为JSFIDLE发布，但我认为只发布链接是最简单的

---

我更喜欢CSS修复，但任何有效的都会非常有用

导航栏li项的顶部有很多填充。 使用@media查询缩小较小设备上的填充。你有

   .navbar-nav > li {
   padding-top: 30px;

通过媒体查询添加附加样式：

 @media (max-width: 381px) {
 .navbar-nav > li {
   padding-top: 10px;
   }
  }

或者你觉得合适的尺寸。我唯一能想到的快速修复方法

或者与之相反

  @media (min-width: 381px) {
 .navbar-nav > li {
   padding-top: 30px;
   }
  }

---

不确定您是否仍然存在这样的问题，但我认为我应该使用jQuery给出我的解决方案：

 $( window ).resize(function() {
    $(".navbar-collapse").css({ maxHeight: $(window).height() - $(".navbar-header").height() + "px" });
});

---

干杯

你能发布一个截图吗？不幸的是，我没有足够的声誉在问题中嵌入一个截图，但这是指向截图的dropbox链接：滚动条在这里可见，对吗？它是可见的，但实际上无法向下滚动到最后两项。正如你所看到的，滚动条也不适合在窗口内…谢谢Russell，这就是我一直在研究的内容。我认为主要的问题在于，在横向模式下，整个屏幕太高，超出了手机的短屏幕尺寸。因此，即使我减少了

项的填充，当单击时，其中许多项都有下拉列表，但仍然无法显示，因为它们将超出设备高度……这甚至是Bootstrap自己的示例中的一个问题（）如果在iPhone上以横向方式查看，然后单击示例下拉列表，菜单项将超出屏幕……yea@dman，没错，特别是因为它是固定的。否则，您可以滚动页面。我想除了用媒体查询隐藏某些项目之外，没有一个很好的解决方案。或显示：无。