Home/ Questions/Q 7590125
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T20:19:44+00:00

I have noticed that rendering of fonts differ considerably if the size is, for

  • 0

I have noticed that rendering of fonts differ considerably if the size is, for example. 11px. Running Windows 7

The following HTML and CSS is used

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Testing font</title>
        <style>
            body {
                font-family: "Helvetica","Arial",sans-serif;
                color: #1A1A1A;
                padding: 10px;
            }

            .foo{
                font-size: 14px;
            }
            .bar{
                font-size: 11px;
            }
        </style>
    </head>
    <body>
        <div class="foo">
                <p>HOME</p>
        </div>
        <div class="bar">
                <p>HOME</p>
        </div>
    </body>
</html>

As the attached images shows, FF and Chrome tends to tighten the width in 11px but not in 14px.enter image description here

Why is that, is there a workaround?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Firefox 7+ under Windows 7 uses GDI Classic mode (with hinting) to render so called Core Web fonts like Arial (since they are more sharp and readable with hinting enabled), and DirectWrite (without hinting) for other fonts. Specific fonts to use GDI mode with are listed in following about:config pref:

    gfx.font_rendering.cleartype_params.force_gdi_classic_for_families

    AFAIK, rendering mode in Firefox depends also on font size. For enough-big font-sizes and too small ones (perhaps greater than 15px and maybe less than 9px), it uses DirectWrite for Core Web fonts too.

    IE9 under Windows 7 uses DirectWrite always.

    Chrome seems to use GDI classic mode always.

    • 0