Question

所以我有一个简单的任务，我似乎无法找到答案。当然，问题在于CSS调整。

包含按钮下拉列表时，我有一个引导按钮组。小组被拉到一个小组内。

以下是Fiddle

的链接

我的按钮组如下：

   <div class="btn-toolbar pull-right" role="toolbar" aria-label="Toolbar with button groups">
     <div class="dropdown">
                        <div class="btn-group-sm" role="group" aria-label="First group">
                            <a href="#" class="btn  btn-secondary dsbtnsec"> Favorite</a>
                                <button href="#" class="btn  btn-secondary dsbtnsec dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Graph Race <span class="caret"></span></button>
                                <ul class="dropdown-menu" role="menu">
                                    <li><a href="#">Bar Chart</a></li>
                                    <li><a href="#">Pie Chart</a></li>
                                </ul>
                            <a href="#" class="btn  btn-secondary dsbtnsec"> County View</a>
                            <a href="#" class="btn  btn-secondary dsbtnsec"> Explore Map</a>
                            <a href="#" class="btn  btn-secondary dsbtnsec"> Export Race &nbsp;<span class="glyphicon glyphicon-export"></span></a>
                        </div>
       </div>
  </div>

Graph Race下拉列表可以正常工作，但不能正确定位在按钮下方。我似乎无法弄清楚CSS问题发生在哪里。有人能指出我正确的方向吗？

问题出现在默认的Bootstrap CSS中，所以它不是我认为我介绍过的。

Answer 1

我认为您的问题是btn-toolbar类：<div class="btn-toolbar pull-right" role="toolbar" aria-label="Toolbar with button groups">

试试这个： <div class="pull-right" role="toolbar" aria-label="Toolbar with button groups">

它为我工作：https://jsfiddle.net/4tgyu9u0/

Bootstrap按钮下拉菜单不在按钮下方

1 个答案: