Rendering font differs from IE compared to FF and Chrome

Question

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

&l         


        

Answer 1

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.

Answer 2

Certain font rendering engines may honor the CSS properties that others don't (like letter-spacing, text-rendering, font-stretch, font-size-adjust and others - see the CSS3 Font Module). You could try playing around with those you find, to eventually come up with (almost) uniform rendering across different browsers.

Answer 3

Not an expert but this worked for me...

 html, body {
    zoom:1; 
    -webkit-transform: scale(1); 
    -moz-transform: scale(1); 
    -ms-transform: scale(1); 
    transform: scale(1)
}

All browser fonts seem to now rendered the same cross-browsers.

Answer 4

Different browsers use different engines.

And even FF will use different algorithm on Linux than on Windows.

And even user settings (zooming, color schemes; possibly for accessibility reasons) can (and will) break your beautiful style mercilessly.

As "workaround" I see two options:

• Well if you really desperately must, render the font at home and put a PNG on the site
• Change your style so that it does not depend on any font size, type or other proportions. So that it will look good (at least readable) in every browser