views:

445

answers:

5

So, there are 2 issues here:

  1. why does it look different (on IE it is bolder, more anti-aliased)

  2. how do I make the Mozilla rendering look like the IE one and what impact does this solution have (I am looking for minimal changes, so solutions such as - flash, silverlight or using images are out of the question)

+1  A: 

You can't unless you can convince Microsoft to use Mozilla's rendering engine, or the other way around. So unless you use your 'out of the question' solutions it ain't going to happen. Font rendering is out of the control of a web designer..

Tomh
+3  A: 

IE looks different because it is using "Clear Type" for rendering the fonts, even if it is not enabled system-wide in Windows. This is not something that you as a web page server can control, but rather is up to the client machine and browser.

If you want Firefox to look similar on Windows, go to Display Settings -> Appearance -> Effects -> "Use the Following Method to Smooth Edges of Screen Fonts" and select "Clear Type". This should apply the same font smoothing effect to Firefox. But as I said, that's up to the end-user, not you the server of web pages.

This site gives a good comparison of font rendering on different browsers.

Xiaofu
A: 

I know you mentioned Flash is out of the questions but have you considered sIFR.

It degrades nicely for non-flash browsers and look the same on supporting browsers.

mr-euro
+1  A: 

Not exactly a "minimal change" but certain fonts and sizes look better/more consistent than others. I couldn't say which combinations off the top of my head but I have noticed that some fonts render a lot more bold at 16px than at 15px for example. Experiment and you might find something you can live with. Alternatively try feeding a different font-weight to IE using conditional comments.

SpliFF
a good practical solution!
Bogdan Gavril
A: 

Hello there, I am a beginner developing a web site for my college, I have a very serious problem with the display in IE(Internet Explorer) and Mozilla. The text on the page is not in the same position for the two browsers. What I am doing is, I am trying to place the text on the image but text is showing differently in the two browsers. Could you please solve this problem.

thank you for the help!

Sandy