title: Align text inside a fixed width button
body: <p>I tried to align a ">" text to a button with fixed width. I tried with align text but it is not center aligned from observation.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;!DOCTYPE html&gt;
      &lt;html&gt;
      &lt;head&gt;
      &lt;style&gt;
      .naviButton {
        height:34px;
        width:16px;
        color:grey;
        text-align:center;
        position:relative;
      }
      &lt;/style&gt;
      &lt;/head&gt;
      &lt;body&gt;
  
      &lt;button class="naviButton"&gt;&lt;&lt;/button&gt;
  
      &lt;/body&gt;
      &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>If I delete the fixed width, the ">" will be centered middle. </p>
  
  <p>I kind of suspect that the aligned element here is actually the start position of ">" text. However, can i centered the mid of text?</p>
  
  <p>Anyone have any idea that can it be centered middle with fixed width. Thank you so much!</p>