title: Why is font-size: 16px bigger in Internet Explorer 11 than in FireFox?
body: <p>As viewed in Firefox 29:</p>
  
  <p><img src="https://i.stack.imgur.com/ntIJh.png" alt="enter image description here"></p>
  
  <p>As viewed in Internet Explorer 11:</p>
  
  <p><img src="https://i.stack.imgur.com/b48Hc.png" alt="enter image description here"></p>
  
  <p>I tried using <code>em</code> and <code>%</code> but the same result. Internet Explorer is always bigger than FireFox (tested Internet Explorer 8, 9, 10 and 11, all the same). Tried changing Internet Explorer text size under view in the menu with no results there either.</p>
  
  <p>CSS is a modified _s for WordPress and this is inside <code>#primary-navigation</code>.</p>
  
  <p>Edits per comments:</p>
  
  <ul>
  <li>Zoom is set to 100% (across browsers).</li>
  <li>Chrome looks fine.</li>
  <li>IE text size is set to medium.</li>
  </ul>
  
  <p>EDITS 2016-12</p>
  
  <p>Many comments requesting the actual CSS. The original CSS has been lost to time but <code>font-family</code> was indeed the issue. This is the corrected portion which uses Google fonts with a number of fallbacks which the client has approved.</p>
  
  <pre><code>ul.menu a {
      display: block;
      padding: 0 5px 0 5px;
      font-family: 'Noto Serif',Palatino,"Palatino Linotype",Georgia,serif;
      font-size: 0.8em;
      font-style: italic;
      line-height: 29px;
      text-decoration: none;
      text-shadow: 1px 1px 0px rgba(255,255,255,0.75);
  }
  </code></pre>