Search code examples
cssfont-face

@font-face works bad in windows (with firefox chrome ie) works fine in Ubuntu


here my problem: the font Fedra looks orrible with @font-face in windows, I don't know why. It looks fine in Ubuntu.

You can see this here

What's the problem?

Here the code css

 @font-face
 {
      font-family: Fedra Sans;
      src: url('../font/FEDRAS01.eot'); /*For IE 6+*/
      src: url('../font/FEDSAB01.ttf');
 }
 @font-face
 {
      font-family: Fedra Sans;
          src: url('../font/FEDRASAM.eot'); 
          src: url('../font/FEDRASAM.ttf');
      font-weight: bold;
 }

Solution

  • ttf and eot fonts are not enough for successfully embedding fonts on the web. Read here: http://www.fontspring.com/blog/the-new-bulletproof-font-face-syntax and here: http://www.fontspring.com/blog/further-hardening-of-the-bulletproof-syntax

    Then you can try and create the @font-face kit using http://www.fontsquirrel.com/fontface/generator