title: align font-awesome icon in the middle
body: <p>Im using font awesome icons. Somehow i cant seem to get them in vertically aligned in the middle.</p>
  
  <p>The white part has to be in the middle of the black part. I made a pen using codepen. <a href="https://codepen.io/kevin-bobsen/pen/qKZKRX" rel="nofollow noreferrer">https://codepen.io/kevin-bobsen/pen/qKZKRX</a>
  I tried:</p>
  
  <pre><code>vertical-align:middle;
  text-align:center;
  </code></pre>
  
  <p>still not working. </p>