title: Show navbar menu item glyphicon only on mobile - Bootstrap
body: <p>I want to show the glyphicon next to my login button, only when the user is on mobile. I am using the visible-xs class for this however, the glyphicon is not aligned with the text when using any responsive utility.</p>
  
  <p>Screenshot:
  <a href="https://i.stack.imgur.com/4JkJh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/4JkJh.png" alt="Screenshot"></a></p>
  
  <p>Code:</p>
  
  <pre><code>    &lt;div class="collapse navbar-collapse" id="myNavbar"&gt;
        &lt;ul class="nav navbar-nav navbar-right"&gt;
          &lt;li&gt;&lt;a href="#"&gt;&lt;span class="glyphicon glyphicon-log-in visible-xs"&gt;&lt;/span&gt; Belépés&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
  </code></pre>