CSSBakery: Fixing font-face Problems in IE

Monday, May 30, 2011

Fixing font-face Problems in IE

GraublauWeb font was working fine in Firefox for me but not in IE. I have the before's and after's to show you the changes that I had to make in order to have it working in IE. To implement font-face that will work across browsers, use Fontspring @font-face syntax.

BEFORE:
@font-face {
font-family:'GraublauWeb';
src: url(http://pics.cssbakery.com/fonts/GraublauWeb.eot);
src: url(http://pics.cssbakery.com/fonts/GraublauWeb.otf) format("opentype");
}

AFTER:
@font-face {
font-family:'GraublauWeb';
src: url("http://pics.cssbakery.com/fonts/GraublauWeb.eot?") format('eot'), url(http://pics.cssbakery.com/fonts/GraublauWeb.otf) format("opentype");
}