Twitter bootstrap Twitter引导：两个下拉切换按钮并排工作不正常

简介：我的网站的一个部分需要一个小工具栏，它有两个并排的下拉菜单。我试图通过以下标记（简化）实现这一点：

文本1

还建议

带有下拉菜单的按钮必须单独包装在.btn工具栏中自己的.btn组中，以便正确呈现

我想知道-有没有可能避免这种单独的包装，在一个btn组中有两个正常运行的下拉列表

我想我是在问一些非常不规范和没有记录的行为，如果没有人能建议一种方法，我会接受“那是不可能的”的回答。
你忘了你的
。下拉菜单
包装器

更新2：忘记了一些组代码。做了一个

更新：制作了更好的包装和按钮样式。这基本上是另一种按钮样式，但没有
.btn
类的包袱


文本1

):

。下拉列表btn{
显示：内联块；
*显示：内联；
/*IE7内联块黑客*/
*缩放：1；
填充：4px 10px 4px；
页边距底部：0；
字体大小：13px；
线高：18px；
*线高：20px；
颜色：#333333；
文本对齐：居中；
文本阴影：0 1px 1px rgba（255、255、255、0.75）；
垂直对齐：中间对齐；
光标：指针；
背景色：#F5；
背景图像：-moz线性渐变（顶部，#ffffff，#e6）；
背景图像：-ms线性渐变（顶部，#ffffff，#e6）；
背景图像：-webkit渐变（线性，0.0,0.100%，从（#ffffff）到（#e6））；
背景图像：-webkit线性渐变（顶部，#ffffff，#e6）；
背景图像：-o-线性梯度（顶部，#ffffff，#e6）；
背景图像：线性渐变（顶部，#ffffff，#e6）；
背景重复：重复-x；
过滤器：progid:DXImageTransform.Microsoft.gradient（startColorstr='#ffffff'，endColorstr='#e6e6'，GradientType=0）；
边框颜色：#e6e6#e6e6#bfbf；
边框颜色：rgba（0,0,0,0.1）rgba（0,0,0,0.1）rgba（0,0,0,0.25）；
*背景色：#e6；
/*默认情况下，将IE7按钮变暗，以便在没有边框的情况下更加突出*/
过滤器：progid:DXImageTransform.Microsoft.gradient（enabled=false）；
边框：1px实心#中交；
*边界：0；
边框底色：#B3；
-webkit边界半径：4px；
-moz边界半径：4px；
边界半径：4px；
*左边缘：.3em；
-webkit盒阴影：插入0 1px 0 rgba（255255255.2），0 1px 2px rgba（0,0,0.05）；
-moz盒阴影：插入0 1px 0 rgba（255255255.2），0 1px 2px rgba（0,0,0.05）；
盒影：插入0 1px 0 rgba（255255255.2），0 1px 2px rgba（0,0,0.05）；
}
.下拉列表btn：悬停，
.下拉列表btn:活动，
.下拉列表-btn.active，
.下拉列表-btn.已禁用，
.下拉列表btn[已禁用]{
背景色：#e6；
*背景色：#d9d9d9；
}
.下拉列表btn:活动，
.dropdown-btn.active{背景色：#cccc\9}
.dropdown btn:第一个子项{*左边距：0}
.下拉列表btn:悬停{
颜色：#333333；
文字装饰：无；
背景色：#e6；
*背景色：#d9d9d9；
/*IE7中的按钮没有边框，所以悬停时会变暗*/
背景位置：0-15px；
-webkit转换：背景位置0.1s线性；
-moz过渡：背景位置0.1s线性；
-ms转换：背景位置0.1s线性；
-o-过渡：背景位置0.1s线性；
过渡：背景位置0.1s线性；
}
.下拉列表btn：焦点{
轮廓：细点#333；
外形：5px自动-webkit聚焦环颜色；
轮廓偏移：-2px；
}
.下拉列表-btn.active，
.下拉列表btn:活动{
背景色：#e6；
背景色：#d9d9d9\9；
背景图像：无；
大纲：0；
-webkit盒阴影：插入0.2px4pRGBA（0,0,0.15），0.1px2pRGBA（0,0,0.05）；
-莫兹盒阴影：插入0.2px4pRGBA（0,0,0,15），0.1px2pRGBA（0,0,0,05）；
盒影：插入0.2px4pRGBA（0,0,0,15），0.1px2pRGBA（0,0,0,05）；
}
.下拉列表-btn.已禁用，
.下拉列表btn[已禁用]{
游标：默认值；
背景色：#e6；
背景图像：无；
不透明度：0.65；
过滤器：α（不透明度=65）；
-webkit盒阴影：无；
-莫兹盒阴影：无；
盒影：无；
}
.下拉列表btn大{
填充：9px 14px；
字体大小：15px；
线高：正常；
-webkit边界半径：5px；
-moz边界半径：5px；
边界半径：5px；
}
.dropdown btn large[class^=“icon-”]{页边距顶端：1px}
.下拉列表btn小{
填充：5px9px；
字体大小：11px；
线高：16px；
}
.dropdown btn small[class^=“icon-”]{页边距顶端：-1px}
.下拉列表btn mini{
填充：2px6px；
字体大小：11px；
线高：14px；
}
.下拉式btn主，
.下拉列表btn主：悬停，
.下拉btn警告，
.下拉btn警告：悬停，
.下载btn危险，
.下拉btn危险：悬停，
.下载btn成功，
.下拉btn成功：悬停，
.下拉列表btn信息，
.下拉列表btn信息：悬停，
.下拉式btn反向，
.下拉列表btn反向：悬停{
颜色：#ffffff；
文本阴影：0-1px0RGBA（0,0,0,0.25）；
}
.下拉列表-btn-primary.active，
.下拉列表-btn-warning.active，
.下拉列表-btn-danger.active，
.dropdown-btn-success.active，
.下拉列表-btn-info.active，
.dropdown-btn-inverse.active{color:rgba（255，255，255，0.75）}
.下拉列表{
边框颜色：#ccc；
边框颜色：rgba（0,0,0,0.1）rgba（0,0,0,0.1）rgba（0,0,0,0.25）；
}
.下拉式btn主{
背景色：#0074cc；
背景图像：-莫兹线性梯度（顶部，#0088cc，#0055cc）；
背景图像：-ms线性梯度（顶部，#0088cc，#0055cc）；
背景图像：-webkit渐变（线性，0,0,100%，从
<div class="btn-group">
    <button class="btn btn-mini dropdown-toggle" data-toggle="dropdown">
        <span id="uniqueId">Text1</span> <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a onclick="javascript:someFunction()">Item1</a></li>
        <li><a onclick="javascript:someFunction()">Item2</a></li>
        ...
    </ul>
    <button class="btn btn-mini dropdown-toggle" data-toggle="dropdown">
        <span id="uniqueId2">Text2</span> <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a onclick="javascript:someOtherFunction()">Item1</a></li>
        <li><a onclick="javascript:someOtherFunction()">Item2</a></li>
        ...
    </ul>
</div>

    <div class="navbar navbar-fixed-top">
        <div class="navbar-inner">
            <div class="container">
                <div class="pull-left">
                    <div class="btn-group btn-group-merge">
                        <a class="btn" href="#" data-toggle="dropdown"><i class="icon icon-certificate"></i></a>
                        <ul class="dropdown-menu">
                             <li><a href="#">One</a></li>
                             <li><a href="#">Two</a></li>
                             <li><a href="#">Three</a></li>
                        </ul>                            
                    </div>
                    <div class="btn-group btn-group-merge">
                        <a class="btn" href="#" data-toggle="dropdown"><i class="icon icon-comment"></i></a>
                        <ul class="dropdown-menu">
                             <li><a href="#">A B C</a></li>
                             <li><a href="#">D E F</a></li>
                             <li><a href="#">G H I</a></li>
                        </ul>                            
                    </div>                        
                </div>
            </div>
        </div>
    </div> 

    .navbar-fixed-top .btn-group-merge {
        margin-left : -5px;
    }
    .navbar-fixed-top .btn-group-merge:first-child {
        margin-left : 0;
    }
    .navbar-fixed-top .btn-group-merge .btn {
        border-radius: 0 4px 4px 0;
    }
    .navbar-fixed-top .btn-group-merge:first-child .btn {
        border-radius: 4px 0 0 4px;
    }

<div class="btn-group">
            <button class="btn btn-primary dropdown-toggle" id="TranslatorActions" type="button" data-toggle="dropdown" style="display:none"> Translator Actions <span class="caret"></span></button>
            <ul id="TranslatorActionsMenu" class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="TranslatorActions">
                <!–– Drop downs are added via script as needed -->
            </ul>
        </div>
        <div class="btn-group">
            <button class="btn btn-primary dropdown-toggle" id="AdminActions" type="button" data-toggle="dropdown" style="display:none">Admin Actions <span class="caret"></span></button>
            <ul id="AdminActionsMenu" class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="AdminActions">
                <li><a role="menuitem" tabindex="-1" href="javascript:void(0);" onclick="OpenAdminForm();">Open Admin Form</a></li>
            </ul>
        </div>