Font difference between Mozilla Firefox and Internet Explorer

I bet this is a fairly common question, which, I think, cannot be resolved, but at least I will try.

Check out this image: http://i.imgur.com/nHPNr.jpg

Go to the following URL for a larger image: http://i.imgur.com/nHPNr.jpg

HTML code:

<div style="font-family: Arial, sans-serif; font-size: 60px; letter-spacing: 0px; padding: 0; margin: 0;">TEXT GOES HERE</div> 

As you can see, the font does not look the same. Is there any way to solve this problem?

  • Internet Explorer Version: 9.0.8112.1641 64-bit
  • Mozilla Firefox Version: 13.0

Any ideas?

+7
source share
2 answers

There is one way to solve the problem: make it an image.

How the text is displayed depends on many factors, such as the installed fonts, the operating system, the calibration of the rendering, the alignment of the fonts, and the rendering options. If any of these parameters is different, the result is different.

If you view your image, you will see that browsers use different options to smooth the fonts, and other options may also be different.

You simply cannot expect an identical result when rendering text in different browsers.

+8
source

Lettering.js is a jQuery plugin that you can use to accurately copy letters. Results may vary.

0
source

All Articles