Question

我正在使用Bootstrap（3.2.0）来建立一个新网站。我添加了一个这样的按钮：

<button id="menu-mobile" type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1">
     <span class="glyphicon glyphicon-th"></span> Menu
</button>

在另一个地方崩溃：

<div class="navbar-collapse collapse in" id="navbar-collapse-1">
  <ul class="nav navbar-nav navbar-right" id="">
     <li><a href="/"><span>Home</span></a></li>
     <li><a href="products"><span>Products</span></a></li>
     <li><a href="some"><span>Some</span></a></li>
     <li><a href="contact"><span>Contact</span></a></li>
</ul>

<script>    
$("#navbar-collapse-1 ul").first().addClass('nav navbar-nav navbar-right').attr('id', '');  
</script> 
</div>

这已添加到此导航中：

<nav id="top-navigation" class="navbar navbar-default navbar-transparent navbar-fixed-top" role="navigation"> 
...
</nav>

现在崩溃从底部开始，向上折叠。但是没有足够的空间，因此隐藏了一个菜单项。

如何强制它从顶部向下打开，以便我可以显示所有菜单项？

我想保持现状：崩溃覆盖了其他内容。那很好。我只想让它向下移动而不是向上移动。

解决方案：感谢@Stephan Weinhold提供以下链接就我而言，它就在这个CSS中：

div#navbar-collapse-1 {
  position: absolute;
  bottom: 0px;   <-- here
  margin: 0 auto;
  width: 790px;
  margin-left: 100px;
  margin-bottom: 3px;
}

我只是将其编辑为顶部：0px;

div#navbar-collapse-1 {
  position: absolute;
  top: 0px;   <-- changed
  margin: 0 auto;
  width: 790px;
  margin-left: 100px;
  margin-bottom: 3px;
}

Force Bootstrap崩溃移动菜单向下移动而不是向上移动？

0 个答案: