javascript - 更改下拉菜单出现的位置？

Question

我正在使用的下拉菜单定义如下:

    <div class="dropdown">
     <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">company</button>
     <ul class="dropdown-menu">
      <li><a href="#">google</a></li>
      <li><a href="#">apple</a></li>
      <li><a href="#">microsoft</a></li>
      <li><a href="#">facebook</a></li>
      <li><a href="#">adobe</a></li>
      <li class="divider"></li>
      <li><a href="#">other</a></li>
     </ul>
    </div>

下拉菜单效果很好，唯一的问题是单击它时，可供选择的元素列表出现在下拉菜单下方(默认情况下)。我想做的是改变这个定位，使列表显示在下拉菜单的中心 顶部(也就是下拉按钮被覆盖)

我不太确定要修补什么才能得到这个，我在 S/O 上搜索但找不到相关帖子。

如有任何帮助，我们将不胜感激 - 谢谢!

Answer 1

尝试添加这个 css 属性

.dropdown-menu {
    z-index: 10;
}