Question

我想让Drop离开而不是在bootstrap下拉按钮下拉。我试图让这种情况发生，但我无法做到这一点，任何人都可以指导我这样做吗？

这是我的代码

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<div class="col-sm-4 col-sm-offset-4">
<div class="btn-group">
  <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Small button <span class="caret"></span>
  </button>
  <ul class="dropdown-menu ">
    <button class="btn btn-primary">Action 1</button>
    <button class="btn btn-danger">Action 2</button>
  </ul>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<script type="text/javascript">
  $(function () {
  $('[data-toggle="popover"]').popover()
})
</script>

Answer 1

这部分css中有top和left：

.dropdown-menu {
  top: -10px !important;
  left: -160% !important;
}

Answer 2

尝试添加此

.dropdown-menu {
  left:auto;
  right:100%;
  top:0;
}

Answer 3

您可以使用css来实现此目的。我目前正在使用手机，但我相信它会像这样。尝试：

.dropdown-menu {
    margin-left:30px;
    margin-bottom:20px;
}

我应该是这样的。您现在可以在左侧显示开头。

我想让Drop离开而不是下降

3 个答案: