title: How to make button heights the same with different font sizes
body: <p>I cannot make button heights same with different font sizes. I have to use em for height and width for responsive design.</p>
  
  <p>Here is example <a href="https://jsfiddle.net/ynxqjytz/3/" rel="nofollow noreferrer">jsfiddle</a></p>
  
  <p>CSS:</p>
  
  <pre><code>body{
    font-size:16px;
  }
  .btn{
    height:4em;
    font-size:1em;
  }
  .btn2{
    height:4em;
    font-size:1.50em;
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;button class="btn"&gt;First Button is 64px as expected&lt;/button&gt;
  &lt;br&gt;&lt;br&gt;
  &lt;button class="btn2"&gt;Why this is not same height with first one?&lt;/button&gt;
  
  &lt;p&gt;
    How to make same height buttons with differnet font sizes ? 
  &lt;/p&gt;
  </code></pre>