title: Vertical align glyphicon in bootstrap 3
body: <p>I have a glyphicon as such:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="col-xs-4 col-sm-2"&gt;
      &lt;span class="glyphicon glyphicon-circle-arrow-up glyphicon-large"&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <pre class="lang-css prettyprint-override"><code>.glyphicon-large {
      min-height: 260px;
      font-size: 35px;
      width: 1em;
      display: block;
      top: 50%;
      margin: -0.5em auto 0px;
  }
  </code></pre>
  
  <p>The glyphicon won't align to the center, vertically. When I open firefox, inspect element, and toggle off/on the <code>top 50%</code> rule, it suddenly works. How come?</p>