Question

I have an SVG font file that is exactly how I want it. When I run it through a converter though (http://onlinefontconverter.com/), the output WOFF file displays different in Chome vs IE9. In IE9, the vertical alignment of the font is off (if I set font-size:100px;line-height:100px; it looks fine in Chrome, but in IE9 the top of the glyphs are chopped off).

Is this a problem with IE9 incorrectly displaying WOFF files, or is there more to it than that?

I did a test where I converted my Courier New TTF file into WOFF, and it displays fine in both browsers. When I take the Courier New SVG, however, and convert that to WOFF, the same display issue arises.

Thanks!

EDIT: The display issue also occurs with EOT files and in IE10. It seems to me like there is some issue converting SVG -> WOFF, but I don't know much about the topic.

Was it helpful?

Solution

For IE < 9 you should use EOT files. WOFF is for modern browsers. The FontSquirrel webfont generator is really helpful for this and will give you the @font-face kit too.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top