title: Bootstrap 3- Inline forms are not aligning properly in Chrome
body: <p>I am using the following code for my inline form (bootstrap 3) but that doesn't seem to work with Google Chrome. I tried it with Firefox and it worked great. Screenshots:</p>
  
  <p><strong>Chrome</strong></p>
  
  <p><a href="http://oi58.tinypic.com/148jjw5.jpg" rel="nofollow">http://oi58.tinypic.com/148jjw5.jpg</a></p>
  
  <p><strong>Firefox</strong></p>
  
  <p><a href="http://oi58.tinypic.com/5fiy41.jpg" rel="nofollow">http://oi58.tinypic.com/5fiy41.jpg</a></p>
  
  <p>The HTML and CSS I'm using:</p>
  
  <pre><code>&lt;style&gt;
  .form-inline .form-group {
      margin-right: 10px;
  margin-left: 4px;
  }
  .form-inline &gt; .form-group {
      vertical-align: top;
  }
  &lt;/style&gt;
  &lt;form id="callForm" action="sendCall.php"  method="post"  class="form-inline" &gt;
  
  &lt;div class="form-group col-md-2"&gt;
  &lt;div class="input-group"&gt;
      &lt;label class="sr-only" for="your"&gt;Your phone number&lt;/label&gt;
  &lt;span class="input-group-addon"&gt;+91&lt;/span&gt;
      &lt;input type="text" class="form-control" id="your" name="your" placeholder="Your 10 digit number" required /&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  
  
   &lt;div class="form-group col-md-2"&gt;
   &lt;div class="input-group"&gt;
      &lt;label class="sr-only" for="frnd"&gt;Friend's number&lt;/label&gt;
  &lt;span class="input-group-addon"&gt;+&lt;/span&gt;
      &lt;input text="text" class="form-control" id="frnd" name="frnd" placeholder="Your friend's number" required /&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
  &lt;button  type="submit" class="btn btn-success"&gt;Connet&lt;/button&gt;
  &lt;/div&gt;
  &lt;/form&gt;
  &lt;script&gt;
  </code></pre>