title: Different font vertical align in line on OS X
body: <p>I have a problem with fonts, because they don't render same on Windows and on OS X. On Windows, characters are vertically aligned in line, but on OS X, the characters are positioned much closer to top of the line.
  I highlighted the text in screenshots so you can see the difference.</p>
  
  <p>I am using font Gotham. Any ideas? Do I have to use browser-specific hacks or is it a font issue?</p>
  
  <p>Link to JSFiddle: <a href="http://jsfiddle.net/wewo/myh4amud/" rel="noreferrer">http://jsfiddle.net/wewo/myh4amud/</a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>body {
   font-family: 'Gotham', Arial, sans-serif;
   background-color: #282828;
   font-size: 14px;
   font-weight: normal;
  }
  
  div {
      color: white;
      font-size: 5em;
      padding-top: 15px;
      padding-bottom: 6px;
      line-height: 1em;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;3&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><img src="https://i.stack.imgur.com/wQT3s.jpg" alt="PC screenshot"><hr>
  <img src="https://i.stack.imgur.com/LbkYK.jpg" alt="Mac screenshot"></p>
  
  <p>Thank you!</p>