输入组文本区域未与输入组按钮对齐

Question

我使用以下输入组和bootstrap：

<div class="input-group" style="padding-left: 20px;">

    <input type="text" name="s" class="form-control input-sm">

    <span class="input-group-btn">
      <button class="btn btn-default input-sm" type="submit"><span class="fa fa-search"></span></button>
    </span>

</div>

结果是与按钮不对齐的文本区域：

我希望文本区域与输入组按钮对齐

Answer 1

是的，他们在自助列中。

  <div class="row">
    <div class="col-sm-6">

    </div> 
    <div class="col-sm-6">
        " your code should be there "
    </div> 
  </div>

see here , your code is given here.

尝试一下，它正在工作

Answer 2

确保它在引导列中正确格式化，它在我的结束时工作正常。

HTML：

<div class="col-sm-6">
   <div class="input-group" style="padding-left: 20px;">
       <input type="text" name="s" class="form-control input-sm">
       <span class="input-group-btn">
         <button class="btn btn-default input-sm" type="submit"><span class="fa fa-search"></span></button>
       </span>
   </div>
</div> 

CodePen Example