title: How to position text over Font Awesome icon?
body: <p>Is there a way to vertically align text stacked on top of a Font Awesome icon? I'd like to move the #1 up in this stack so that it is centered in the cup of the trophy icon. I tried adding bottom-margin and bottom-padding in the span that encapsulates the #1, but neither one did the trick. Is there an easy way to do what I'm trying to accomplish, or do I need to go another route?</p>
  
  <pre><code>&lt;span class="fa-stack fa-3x"&gt;
    &lt;i class="fa fa-trophy fa-stack-2x"&gt;&lt;/i&gt;
    &lt;span class="fa fa-stack-1x" style="color:red;"&gt;
      &lt;span style="font-size:35px;"&gt;
        #1
      &lt;/span&gt;
    &lt;/span&gt;
  &lt;/span&gt; 
  </code></pre>
  
  <p><a href="http://jsfiddle.net/wc2jP/" rel="noreferrer">http://jsfiddle.net/wc2jP/</a></p>