How to align a div with the pull-right class vertically in the loading center

Question

I want to create a form line with an input field and button label. The first two elements must be aligned if the button is aligned to the right. I tried the pull-right class, but it destroys the vertical alignment of the button. I want it to be vertically centered. I tried to set the height of the line, but it destroys the vertical alignment of the label. (I want the label to be vertically aligned with the input too)

<form class="form-horizontal">
   <div class="form-group col-sm-11">
       <label for="inputEmail3" class="col-sm-1 control-label">Email</label>
       <div class="col-sm-3">
           <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
       </div>
   </div>
   <div class="pull-right">
        <button>Add</button>
   </div>
</form>

http://plnkr.co/edit/i8jmEowKaKOcM2P8N225?p=preview

Answer 1

: , form-inline. 768 ( , ).

. .

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<form class="form-inline">
  <div class="form-group">
    <label for="inputEmail3">Email</label>
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
  <div class="pull-right">
    <button class="btn btn-default">Add</button>
  </div>
</form>

Hide result