引导程序4行内表单全宽

Question

我有一个内嵌表单，其中包含搜索栏和旁边的搜索按钮。我如何强制input-group div跨Bootstrap 4中的整个列，最好是不使用自定义CSS？

<div class="container"> 
    <div class="row"> 
    <div class="col-md-12"> 
     <form class="form-inline" action="/search" accept-charset="UTF-8" method="get"> 
     <div class="input-group"> 
      <input type="text" name="search" id="search" value="test" placeholder="Search accounts, contracts and transactions" class="form-control"> 
      <span class="input-group-btn"> 
      <input type="submit" name="commit" value="Search" class="btn btn-primary" data-disable-with="Search"> 
      </span> 
     </div> 
     </form> 
    </div> 
    </div> 
</div> 

Answer 1

只需卸下form-inline ..

<div class="container"> 
    <div class="row"> 
    <div class="col-md-12"> 
     <form action="/search" accept-charset="UTF-8" method="get"> 
     <div class="input-group"> 
      <input type="text" name="search" id="search" value="test" placeholder="Search accounts, contracts and transactions" class="form-control"> 
      <span class="input-group-btn"> 
      <input type="submit" name="commit" value="Search" class="btn btn-primary" data-disable-with="Search"> 
      </span> 
     </div> 
     </form> 
    </div> 
    </div> 
</div> 

演示：http://www.codeply.com/go/4eu7w6KPkT