Bootstrap输入表单，搜索按钮和同一行中的不同按钮

Question

<div class="container-fluid"><br/>
   <h3 >Content Mangement</h3><br/>
   <div class="container-fluid"></div><br/>
 <div class="row"><br/>
  <div class="col-md-2"><br/>
       <input class="form-control custom-input-width pull-left" type="text"> <br/>
    </div><br/>
    <div class="col-md-10 text-right"><br/>
    <button type="button" class="btn btn-primary">Search</button><br/>
<button type="button" class="btn btn-success">Add Content</button><br/>
    <button type="button" class="btn btn-success">Reoder</button><br/>
  </div><br/>

  

我想把这样的代码放进去。我正在打字过去3天4天：

我希望这个文字，输入表格和按钮在同一行：

Answer 1

你的结构被破坏所以如果你把你的结构纠正到一个合适的结构，我们可以通过一些css修复得到你想要的现有方法，但是如果你愿意，我可以建议更好的方法来布局这个东西，因为这样的方式是做这种布局设计有点不合适。

然而，根据您当前的方法，更正确的结构如下所示：

<div class="row">
        <div class="col col-md-4">
            <h3>Content Mangement</h3>
         </div>

        <div class="col col-md-2 col-md-offset-3">
            <input class="form-control custom-input-width" type="text">
        </div>
        <div class="col col-md-1">
            <button type="button" class="btn btn-primary">Search</button>
        </div>
        <div class="col col-md-1">
            <button type="button" class="btn btn-success">Add Content</button>
        </div>
        <div class="col col-md-1">
            <button type="button" class="btn btn-success">Reoder</button>
        </div>
    </div>
</div>

然后通过一些填充修复，您可以使用当前的方法实现设计