Google web fonts causing peekaboo bug in IE7

[benjaminvo]

Hi, hope someone can help me.

I’m using two google web fonts on my a site. Works great in all browsers, but they don’t display correctly in IE7. Words and lines sporadically drops out. It only happens in one section of the site – not in the navigation, the logo etc., which uses the same fonts.

I have tried the usual peekaboo-hacks zoom:1 and min-width:0 with no success. Choosing a “safe” web font solves the problem though – but that’s not a very good solution…

Can anyone help? Any feedback is very much appreciated.

Thank you :)

[SgtLegend]

My first thought would be do you have a correct line-height set as unless you do IE7 won’t correctly display fonts that don’t have an inherited line-height

[benjaminvo]

Thanks for your advice.

But I have found out that it has something to do with my meta charset declaration. No matter what I do, it won’t work (utf-8). Therefor I had to type all the danish characters with html entities – and that broke all the paragraphs and headings in IE7.

I still haven’t fixed this encoding problem…

[benjaminvo]

Solved.

It wasn’t a problem with the encoding. It was the particular google web font i am using (Molengo), that triggered the peekaboo bug in all the major “PC-browsers” except IE8 and IE9 – but only if was using the scandinavian letters æ, ø and å in paragraphs. Would probably also happen with other “foreign” characters, but I didn’t test that out.

The bug didn’t happen using another google web font. Only Molengo.

Downloading the font and refering to it via @font-face solved everything. Took some time to find out though :)…

[Author]

Posts