@font-face for IE ?

[MrMiyagi]

Hi,

I have a question about the @font-face feature. I have it working fine in firefox, but there is a problem with IE.

This is how its supposed to work in IE:

<!--[if IE]>
<style type="text/css" media="screen">
@font-face{
font-family:'font1';
src: url('../fonts/font1.eot');
}
</style>
<![endif]-->

I got it working with one font but the problem is that I need to embed 3 fonts. For other browsers this work:

@font-face{
font-family:'font1';
src: url('../fonts/font1.otf') format('opentype');
}

@font-face{
font-family:'font2';
src: url('../fonts/font2.otf') format('opentype');
}

@font-face{
font-family:'font3';
src: url('../fonts/font3.otf') format('opentype');
}



For IE, I tried the following:

<!--[if IE]>
<style type="text/css" media="screen">

@font-face{
font-family:'font1';
src: url('../fonts/font1.eot');
}

@font-face{
font-family:'font2';
src: url('../fonts/font2.eot');
}

@font-face{
font-family:'font3';
src: url('../fonts/font3.eot');
}

</style>
<![endif]-->

But this does not work. I have all fonts in otf & eot format. So my question is:

How to embedd more than 1 font so that it also works in IE?

 

[darryncooke]

your syntax is a bit off

@font-face {
font-family: "Font Name";
src: url(

http://url/Font

Name.ttf) format("truetype");
}

Darryn Cooke

http://www.darryncooke.com

| The New Orange County Graphic designer and Marketing and Advertising Consultant

http://www.bloobie.com

| Marketing and Advertising blog