Html 引导下拉列表未按预期工作

我想这样做

所以我试过这个

股票






命令
内容
背景
推销
客户

但输出不符合我的要求（如图所示）。请告诉我怎么做

---

注意请忽略图标，我无法在bootply中附加图像。

我希望它可以帮助您：

bootply:

HTML:

<div class="container">
<div class="row">
<div class="btn-group col-md-2" data-toggle="buttons">
  <a class="icon-box-add dropdown-toggle" data-toggle="dropdown">  Stock
   <span class="caret"></span>
    </a>        
    <ul class="dropdown-menu pull-right">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li><a href="#">Separated link</a></li>
    </ul>


  </div>
<div class="col-md-2">Orders</div>
<div class="col-md-2">Content</div>
<div class="col-md-2">Setting</div>
<div class="col-md-2">Marketting</div>
<div class="col-md-2">Customers</div>

</div>
</div>

命令
内容
背景
推销
客户

更新：

<div class="container">
<div class="row">
<div class="btn-group col-md-2" data-toggle="buttons">
  <a class="icon-box-add dropdown-toggle" data-toggle="dropdown">  Stock
   <span class="caret"></span>
    </a>        
    <ul class="dropdown-menu pull-right">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li><a href="#">Separated link</a></li>
    </ul>


  </div>
<div class="col-md-2">Orders</div>
<div class="col-md-2">Content</div>
<div class="col-md-2">Setting</div>
<div class="col-md-2">Marketting</div>
<div class="col-md-2">Customers</div>

</div>
</div>

将

col-md-2

更改为只

向左拉

右边加边距

更新2:

---

注释：在图像中，div并排出现

在添加背景（如您的图像）时，您可以看到它们并排出现。。。

---

请在bootply中保存您的项目，因为您的链接是一个新的bootply…您的bootply是一个新的空项目；请分享你的想法demo@Jahnux73对不起，我的愚蠢。我已经更新了。请check@IrvinDomininakaEdward很抱歉。现在我已经更新了。请看一看图片，可以看到div并排排列，但是bootply中有空格（例如stock和order之间的空格）。如何删除它有很多答案，所以：请检查我的更新，oups a查找内容，请稍候…再次感谢您的回答。我看到我发布的代码只有一个下拉列表（库存），但我希望所有字段都下拉列表（如图中所示（库存、订单、设置）所有的都是下拉的。所以如果我做了所有的下拉，那么在你建议的4个链接中我应该使用哪一个没有朋友。我不会再打扰你了。再次感谢你的回答