更改下拉列表的位置?

时间:2014-08-07 22:28:48

标签: javascript jquery html css drop-down-menu

我有一个我正在使用的下拉列表定义如下:

    <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上搜索但无法找到相关的帖子。

非常感谢任何帮助 - 谢谢!

2 个答案:

答案 0 :(得分:0)

尝试添加此css属性

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

答案 1 :(得分:0)

您可以使用顶部和左侧属性执行此操作:

.dropdown-menu {
    top: -4px;
    left: -2px;
}