title: "glyphicon glyphicon-search" button is not attached to text field
body: <p>I have in the <em>navbar-right</em> a search field with a button. However, the button is below the search field.
  How is it possible to attach the button to the search field?</p>
  
  <pre><code>&lt;div class="navbar navbar-default navbar-fixed-top" role="navigation"&gt;
    &lt;div class="container"&gt;
  
      &lt;div class="navbar-header"&gt;
        &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"&gt;
          &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
        &lt;/button&gt;
        &lt;a class="navbar-brand" href="{{url_for('home')}}"&gt;TEST&lt;/a&gt;
      &lt;/div&gt;
      &lt;div class="navbar-collapse collapse" id="navbar-collapsible"&gt;
        &lt;ul class="nav navbar-nav navbar-left"&gt;
  
          &lt;li class="active"&gt;&lt;a href="{{url_for('home')}}"&gt;Home&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
        &lt;ul class="nav navbar-nav navbar-right" role="search"&gt;
      &lt;form class="navbar-form" method="get" action="{{ url_for('search')}}" role="form"&gt;
        &lt;div class="form-group" style="display:inline;"&gt;
      &lt;div class="input-group"&gt;
        &lt;input class="form-control" type="text" name="snpid" placeholder="e.g. Hello"&gt;
        &lt;button class="btn btn-default"&gt;&lt;span class="glyphicon glyphicon-search" type="submit"&gt;&lt;/span&gt;&lt;/button&gt;
      &lt;/div&gt;
        &lt;/div&gt;
      &lt;/form&gt;
        &lt;/ul&gt;
      &lt;/div&gt;&lt;!--/.nav-collapse --&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>