IE7 and 8 smaller font size issues with SIFR
my site http://tweetMP.org.au uses SIFR to display h2 flash font headers.
If you compare the site between Firefox and IE7 / 8, you will notice that the titles are noticeably different in IE (only 7 and 8 - IE6 looks great).
Setting the font size on my ie (7 and 8 specific css) does nothing.
Any ideas why this is so?
-V
a source to share
I would recommend setting the font size in the sifr config file, something similar to this: (note the font size element). This will make sure the font size is in sifr and may help you. if it doesn't let me know, there is another solution I can think of :)
sIFR.replace ({
Selector: '.din-20-bold',
src: 'fonts / din.swf',
highsrc: 'fonts / din.swf',
css: {
'.sIFR-root': {'text- transform ':' uppercase ',' color ':' # FFFFFF ',' text-align ':' right ',' width ':' 484px ',' font -size ':' 20px ',' font-weight ': 'bold'},
},
wmode: "transparent",
paddingTop: 0
});
a source to share
Your problem might be using pixels (px) for the font size. While ems (em) is the modern way to scale fonts, percentages (%) are displayed more consistently across browsers. Try this, and check sIFR again. For more information, read the articles below, one of which (in A List Apart) quotes:
Fixed IE6 and IE7 exaggerated text resizing - this is body size using percentage
a source to share