1

我有以下代码 - 3 个按钮下拉菜单彼此相邻，每个都有自己唯一的 ID。但是，在第一个 2 上按下插入符号不会执行任何操作，而在按下第三个插入符号时会出现第一个上的下拉菜单。有什么理由吗？我是否错过了为 Button Group 添加独特性的东西？引导程序中的错误？

<div class="btn-group" id="all-sectors">
    <button class="btn btn-larger btn-primary title">All Sectors</button>
    <button class="btn btn-larger btn-primary dropdown-toggle" data-toggle="dropdown">
       <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a href="#" class="camera-filter" data-filter-type="all">All Cameras</a></li>
        <li><a href="#" class="camera-filter" data-filter-type="camera-Joe0">camera-Joe0</a></li>
            <li><a href="#" class="camera-filter" data-filter-type="North-Joe0">North-Joe0</a></li>
        <li><a href="#" class="camera-filter" data-filter-type="East-Joe0">East-Joe0</a></li>
    </ul>
</div>

<div class="btn-group" id="all-grids">
    <button class="btn btn-larger btn-primary title">All Grids</button>
    <button class="btn btn-larger btn-primary dropdown-toggle" data-toggle="dropdown">
       <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a href="#" class="camera-filter" data-filter-type="all">All Cameras</a></li>
        <li><a href="#" class="camera-filter" data-filter-type="camera-Joe0">camera-Joe0</a></li>
    </ul>
</div>

<div class="btn-group" id="all-cameras">
    <button class="btn btn-larger btn-primary title">All Cameras</button>
    <button class="btn btn-larger btn-primary dropdown-toggle" data-toggle="dropdown">
       <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a href="#" class="camera-filter" data-filter-type="all">All Cameras</a></li>
        <li><a href="#" class="camera-filter" data-filter-type="camera-Joe0">camera-Joe0</a></li>
    </ul>
</div>
4

1 回答 1

1

问题出在我的 CSS 中。我添加了一个

float:left;

对于阻止前两个正常工作的每个 .btn-group。我应该把它们包在一个

.btn-toolbar

包装器代替。

于 2012-05-22T19:46:42.343 回答