下拉引导程序不会显示滚动条

Question

我使用bootstrap的代码如下：

    <div ng-controller="DropdownCtrl">
        <div style="height: 100px; overflow-y: auto;">


            <!-- Single button -->
            <div class="btn-group" dropdown is-open="status.isopen">
                <button type="button" class="btn btn-primary dropdown-toggle" ng-disabled="disabled">
                    Button dropdown <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>
    </div>

http://plnkr.co/edit/DwQIi6ipDgN9LIOe5TqR?p=preview

当我点击下拉列表时，它会显示在滚动条下方，如何让它显示在滚动条的顶部？

这是我的问题的屏幕截图：

我想要做以下事情:(编辑）

由于

Answer 1

如果您仍在寻找答案，可以尝试

<div style="width:200px;height:100px;line-height:3em;overflow:auto;padding:5px;">

这会将滚动条移动到下拉列表的一侧而不是页面的一侧

对于滚动条下方的下拉列表问题，您需要更改框打开的方向，在bootstrap中，它的位置设置为绝对值并且左侧：0;你需要改变这个：0;

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;    <--- change this to right:0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    background-clip: padding-box;
}

Answer 2

你的意思是你想要下拉菜单吗？如果是这样，请点击此处：http://getbootstrap.com/components/#btn-dropdowns-dropup

好的还是不确定你的意思，但我想也许可以试试，在你的代码中：14

<div style="height: 100px; overflow-y: auto;">

100px高度和溢出导致滚动条显示删除它们。

Answer 3

第14行具有以下代码：

<div style="height: 100px; overflow-y: auto;">

但是，这会将您的下拉限制为仅100px的高度。有趣的是，这是在第二行文本之后。

要修复，请删除样式的高度和溢出部分。在这种情况下，您可以只有一个<div>