css - 下拉菜单低于部分 View 的可见区域

Question

我使用带有复选框的下拉列表，如图所示。

http://pokit.org/get/?7c1ecede2a99c5fc2c15f63baa153dae.jpg

这是下拉代码，虽然我认为这无关紧要。

  <div class="dropdown">
            <a class="dropdown-toggle btn" data-toggle="dropdown" href="#">
                Tipovi naknade
                <b class="caret"></b>
            </a>
            <ul class="dropdown-menu dropdown-menu-form" role="menu">
                @{ int counter = 0;}
                @{ string id = "SelectedTypes_" + counter.ToString() + "_";}
                @foreach (var rightGroup in Model.RightGroupList)
                {
                    <li>
                        <label class="checkbox">
                            <input id="@id" name="SelectedTypes[@counter]" value="@rightGroup.Id" data-value="@rightGroup.Id" type="checkbox" class="input-md minimal" checked />
                            @rightGroup.RIGHTGROUPNAME
                            @{ counter++;}
                        </label>
                    </li>
                }
            </ul>
        </div>

下拉列表位于局部 View 中，因此它的高度受限于同一局部 View 的高度。

有没有办法让这个下拉菜单在部分 View 的边界之外可见，我希望它尽可能地下拉。我知道这不是最佳解决方案，但稍后我会处理滚动问题。

是否可以通过在整个屏幕上扩展局部 View 来完成？谢谢

已编辑这是 HTML 代码，(所有控件都在同一行 div 中)

<div class="row">
    <div class="col-md-12 col-lg-12 form-group" id="divRightGroupList">
        <div class="dropdown" style="overflow: visible">
            <a class="dropdown-toggle btn" data-toggle="dropdown" href="#">
                Tipovi naknade
                <b class="caret"></b>
            </a>
            <ul class="dropdown-menu dropdown-menu-form" style="overflow: visible"  role="menu">


                    <li>
                        <label class="checkbox">
                            <input id="SelectedTypes_0_" name="SelectedTypes[0]" value="1" data-value="1" type="checkbox" class="input-md minimal" checked />
                            LICNA INVALIDNINA (CLAN 12 ZAKONA)

                        </label>
                    </li>
</ul>
        </div>

Answer 1

如果您有一个定义了高度的 div 和应用了 CSS 样式 overflow:hidden，那么该 div 内超出边界的任何内容都将被剪切离开。解决这个问题的唯一方法是不使用 overflow:hidden。如果您将它设置为 visible(如果您完全删除 overflow 属性，这是默认设置)或 auto(这将在 div 中启用滚动条)，您将能够看到整个下拉菜单。但是，在后一种情况下 (overflow:auto)，您可能必须滚动才能看到下拉菜单的截断部分。让它显示的唯一方法是使用 visible。