CSS @font-face not working in ie

Question

I have the following css that works within Firefox but not i.e.? Obviously the fonts are within the directory... Any suggestions?

 @font-face {
          font-family: "Futura";
          src: url("../fonts/Futura_Medium_BT.eot"); /* IE */
          src: local("Futura"), url( "../fonts/Futura_Medium_BT.ttf" ) format("truetype"); /* non-IE */  
        }

body nav {
    font-family: Futura,  Verdana, Arial, sans-serif;
    font-size:1.2em;
    height: 40px;
}

Answer 1

You could use the Google Font API. They say it works from IE 6 and up. (I've not tested this.)

Google’s serving infrastructure takes care of converting the font into a format compatible with any modern browser (including Internet Explorer 6 and up), ...

Answer 2

if you would like a cross browser font that is not web safe use one of the following. http://wiki.github.com/sorccu/cufon/about (canvas javascript) http://www.mikeindustries.com/blog/sifr (flash)

Answer 3

http://readableweb.com/mo-bulletproofer-font-face-css-syntax/

Answer 4

I've written a blog post in the past on how to get @font-face working from scratch. Feel free to have a look: Adventures with @font-face.

Answer 5

I read a lot of tutorials that suggested hacks, so I came up with this solution I think is better... It seems to work fine.

@font-face { 
    font-family: MyFont; src: url('myfont.ttf'); 
}
@font-face{ 
    font-family: MyFont_IE; src: url('myfont.eot'); 
}
.my_font{ 
    font-family: MyFont, MyFont_IE, Arial, Helvetica, sans-serif; 
}