Text Expansion in IE


i am new to web development and basically working with html and css.

while applying css to the titles or to menu items what i found is that the text appears normal in firefox or in other browsers except the IE in which it appears somewhat to be a little expanded or stretched. Because of this the alignment of the titles and the menus on the whole web site gets disturbed and the layout of the whole web site gets changed…

what can be done regarding this ??

i used google fonts on my site which i thought would give a standard font for all the browsers but nothing came out of it…IE also affects these fonts.


Hi djsahay. Unfortunately, you can never get fonts to appear exactly the same cross browser, because each browser / system has its own way of displaying them. You could serve up some IE-only code to reduce the letter spacing, but it’s a burrow you are pretty much better off not going down. Either accept the display as it is (people can always use Chrome or another browser if they choose) or perhaps try a different font that looks better.

You need to be less restrictive as to how things look on your website. As Ralph mentioned, each browser won’t dipslay exactly the same. It’s just not feasible to expect a result like that.

Your best bet would be to rework your code to allow for some leeway aesthetically.

It also depends on how you are declaring the fonts – some elements (tables come to mind) don’t inherit fonts the same way, particularly if IE ends up in ‘quirks mode’ instead of ‘standards mode’… but really to further diagnose we’d have to see the code for the page (or even better a live copy) since without seeing what it is you are actually doing, we can’t really weigh in on it more. Without seeing what you are doing, anything we tell you is a wild guess.

Though personally, I’ve had nothing but bad luck trying to use Google fonts – which is why I generally use font squirrel and host myself; or don’t bother.