css - Bootstrap - 下拉菜单为父 DIV 创建滚动条

Question

Bootstrap dropdown 在父 div 放置在底部时创建滚动条。有谁知道如何修复它？

jsFiddle为此。

很容易在bs-example 类上设置overflow: hidden 或overflow: visible。但我需要滚动条，因为我会动态地向那个 div 添加内容。那时它需要滚动条。即使我有滚动条，下拉菜单也会被推到底部。下拉菜单不能 float 在滚动条上或者当底部没有足够的空间时我可以向上打开吗？

Answer 1

你必须使用溢出:继承；而不是自动。

http://jsfiddle.net/gildonei/xMddf/1131/

.bs-example
{
    margin: 30px;
    height: 100px;
    border: 1px solid #F00;
    overflow: inherit;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/>

<div class="bs-example">
      <div class="btn-group">
        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Default <span class="caret"></span></button>
        <ul class="dropdown-menu" role="menu">
          <li><a href="#">Action</a></li>
          <li><a href="#">Another action</a></li>
          <li><a href="#">Something else here</a></li>
          <li class="divider"></li>
          <li><a href="#">Separated link</a></li>
        </ul>
      </div>
    </div>