Twitter bootstrap 对齐直线中的元件

我有以下代码：

<div class="container">
    <div class="row">
        <div class="col-md-3">
            <div class="input-group">
                <input type="text" class="form-control input-sm" placeholder="Search Ticket" />
                <span class="input-group-btn">
                     <button class="btn btn-default btn-sm btn-default-gradient" type="button">
                         <i class="glyphicon glyphicon-search"></i>
                     </button>
                </span>
            </div>
            <button type="button" class="btn btn-default btn-sm btn-default-gradient">
                <span class="glyphicon glyphicon" aria-hidden="true"></span> Search Tools
            </button>
        </div>
        <div class="col-md-6"></div>
        <div class="col-md-3">
            <button type="button" class="btn btn-default btn-sm btn-default-gradient pull-right">
                <span class="glyphicon glyphicon" aria-hidden="true"></span> New Ticket
            </button>
        </div>
    </div>
</div>

搜索工具
新票

我对“搜索工具”按钮有一个问题，它在新的一行出现了。 它看起来像：

我想要的是：

---

表单组

和

表单内联

应该在这里起作用：

搜索工具

在当前系统中集成我的表单：

<div class="container">
    <div class="row">
        <div class="col-md-3">
          <form class="form-inline">
            <div class="form-group col-md-7">
              <div class="input-group">
                  <input type="text" class="form-control input-sm" placeholder="Search Ticket">
                  <span class="input-group-btn">
                       <button class="btn btn-default btn-sm btn-default-gradient" type="button">
                           <i class="glyphicon glyphicon-search"></i>
                       </button>
                  </span>
              </div>
            </div>
            <button type="button" class="btn btn-default btn-sm btn-default-gradient col-md-5">
                <span class="glyphicon glyphicon" aria-hidden="true"></span> Search Tools
            </button>
          </form>
        </div>
        <div class="col-md-3"></div>
        <div class="col-md-3">
            <button type="button" class="btn btn-default btn-sm btn-default-gradient pull-right">
                <span class="glyphicon glyphicon" aria-hidden="true"></span> New Ticket
            </button>
        </div>
    </div>
</div>

搜索工具
新票

搜索工具
新票

---

请注意，我将col-md-3增加到col-md-6，因为它不适合form+按钮。希望这有帮助

它不起作用，它使每个组件都处于新的状态。。。有点小问题。修好了。添加了工作bootply@Kapparinohey您的解决方案看起来不错，但您使用的是div而不是表单。除此之外，我认为它实际上看起来很棒。我使用div是因为@Kapparino的源代码中没有form标记。这就是我没有添加它的原因。yuyokk您的解决方案也很好，我向您竖起大拇指，但我喜欢这个带有表单内联和group@CodingEnthusiast give的解决方案，不使用有意义的col-md-sizeyes。我认为您需要那些col-md-X col。注意，如果您需要进行偏移，请不要使用空标记，例如，只使用col-md-offset-6。

<div class="container">
    <div class="row">
        <div class="col-md-3">
          <form class="form-inline">
            <div class="form-group col-md-7">
              <div class="input-group">
                  <input type="text" class="form-control input-sm" placeholder="Search Ticket">
                  <span class="input-group-btn">
                       <button class="btn btn-default btn-sm btn-default-gradient" type="button">
                           <i class="glyphicon glyphicon-search"></i>
                       </button>
                  </span>
              </div>
            </div>
            <button type="button" class="btn btn-default btn-sm btn-default-gradient col-md-5">
                <span class="glyphicon glyphicon" aria-hidden="true"></span> Search Tools
            </button>
          </form>
        </div>
        <div class="col-md-3"></div>
        <div class="col-md-3">
            <button type="button" class="btn btn-default btn-sm btn-default-gradient pull-right">
                <span class="glyphicon glyphicon" aria-hidden="true"></span> New Ticket
            </button>
        </div>
    </div>
</div>

<div class="container">
    <div class="row">
        <div class="col-md-6">
          <div class="form-inline">
            <div class="form-group">
              <div class="input-group">
                  <input type="text" class="form-control input-sm" placeholder="Search Ticket" />
                  <span class="input-group-btn">
                       <button class="btn btn-default btn-sm btn-default-gradient" type="button">
                           <i class="glyphicon glyphicon-search"></i>
                       </button>
                  </span>
              </div>
            </div>
            <button type="button" class="btn btn-default btn-sm btn-default-gradient">
                <span class="glyphicon glyphicon" aria-hidden="true"></span> Search Tools
            </button>
          </div>
        </div>
        <div class="col-md-3"></div>
        <div class="col-md-3">
            <button type="button" class="btn btn-default btn-sm btn-default-gradient pull-right">
                <span class="glyphicon glyphicon" aria-hidden="true"></span> New Ticket
            </button>
        </div>
    </div>
</div>