引导程序中的锚和输入组的垂直对齐

Question

我正在尝试排列以下组件，以便它们的中间位置居中。我不知道哪个CSS属性导致按钮更低。

<div class="buttons"> 
    <a href="/create" class="btn btn-sm btn-default"><span class="fa fa-codepen"></span>New</a> 
    <a href="/upload" class="btn btn-sm btn-default"><span class="glyphicon glyphicon-floppy-open"></span>Upload</a> 
    <a href="/download" class="btn btn-sm btn-default"><span class="glyphicon glyphicon-floppy-save"></span>Download</a> 
    <div style="display: inline-block;"> 
     <div class="input-group" style="width:20em"> 
      <input style="" class="form-control focus" id="Search" name="Search" type="search"> 
      <span class="input-group-btn"> 
       <button class="btn default btn-primary" type="button" ng-click="rc.search()">Search</button> 
      </span> 
     </div> 
    </div> 
</div> 

这里是bootply。

Answer 1

http://www.bootply.com/MG2xUvxvR9#

输入组需要被一个form-group标签内缠绕。然后我用form-inline把整个东西包裹起来。