由表格单元格部分隐藏的引导程序下拉列表

时间:2017-09-28 18:40:57

标签: html css twitter-bootstrap drop-down-menu

obscured dropdown

以下是用于创建下拉列表的html:

<div class="btn-group pull-right elipsis-margin open">
<button type="button" class="btn btn-link btn-action dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" data-validation-status="ok">
    <i class="fa fa-ellipsis-v fa-lg"></i>
</button>
<ul class="dropdown-menu">
    <li><a href="#shareModal" data-toggle="modal" class="btn-action"><i class="fa fa-share fa-fw"></i>Share</a></li>
    <li><a href="#"><i class="fa fa-pencil fa-fw"></i>Edit</a></li>

    <li role="separator" class="divider"></li>
    <li><a href="#unshareModal" data-toggle="modal" class="btn-action"><i class="fa fa-ban fa-fw"></i>Unshare</a></li>
</ul>

此div位于表体内部。显然,表格单元格会使下拉列表变得模糊不清,但是它的z位置设置为1000.它似乎应该正确显示。

非常感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

z-index仅适用于其position属性已明确设置为绝对,固定或相对的元素。

尝试将您的下拉位置设置为以上之一。您可能还需要为表格执行此操作。

例如:

.your-class {
  position: relative;
}