Geek Answers Handbook

@ font-face does not work in IE7

I try all this differently:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style type="text/css"> @font-face { font-family: "cursivas"; src: url(Freestyle.ttf) format("truetype"); } @font-face { font-family: "tabs"; src: url(FrutigerLTStd-Bold.otf) format("truetype"); } @font-face { font-family: 'topMenuFont'; src: url('frutigerltstd-bold-webfont.eot'); src: url('frutigerltstd-bold-webfont.eot?#iefix') format('embedded-opentype'), url('frutigerltstd-bold-webfont.woff') format('woff'), url('frutigerltstd-bold-webfont.ttf') format('truetype'), url('frutigerltstd-bold-webfont.svg#FrutigerLTStd65Bold') format('svg'); font-weight: normal; font-style: normal; } p.customfont { font-family: "cursivas"; } p.tabs{ font-family:'tabs';color:#8e8e8e; } p.menu{ font-family:'topMenuFont'; } p{ font-size:30px; color:#8e8e8e; } </style> </head> <body> <p class="customfont">FAMILIAS <span style="color:blue">RESERVAS</span></p> <p class="tabs">FAMILIAS <span style="color:blue">RESERVAS</span></p> <p class="menu">FAMILIAS <span style="color:blue">RESERVAS</span></p> <p>FAMILIAS <span style="color:blue">RESERVAS</span></p> </body> </html>

The path is ok because they all work in FF,

any idea what i'm missing?

+4
source share
2 answers

Try the syntax described below here :

 @font-face { font-family: 'MyFontFamily'; src: url('myfont-webfont.eot?#iefix') format('embedded-opentype'), url('myfont-webfont.woff') format('woff'), url('myfont-webfont.ttf') format('truetype'), url('myfont-webfont.svg#svgFontName') format('svg'); }

Got a link from fontsquirrel.com, they use it for all generated fonts. You can also take a look at the Google Web Font generated by css (it only displays fonts for the browser you are using)

And load it into an external css file, which may also solve some problems.

+2
source

If I remember correctly, IE 7 only supports EOT with @ font-face, not TTF.

0
source

More articles:


All Articles