title: vertically center align <a> tag
body: <p>html</p>
  
  <pre><code>&lt;a id='aTag' href='#'&gt; a link &lt;/a&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>#aTag {
     display: inline-block;
     width: 100px;
     height: 100px;
     background: red;
     text-align: center;
  }
  </code></pre>
  
  <p>The <code>text-align: center</code> does horizontal-center for a <code>a</code> element. How do you vertically center it?</p>
  
  <p>using: <code>vertical-align: middle</code> does not work. </p>
  
  <p>Note: Other solutions provided are for multiple divs, not for an <code>&lt;a&gt;</code> tag.</p>