CODEWITHSUNDEEP
cssinternet-explorerfirefoxfont-face
Patrick R
Patrick R

Reputation: 1979

Font-face isn't working in Firefox

I have added a font to a site, added the CSS and uploaded the font files and it is working in IE but not in Firefox. Why is that?

CSS:

@font-face {
    font-family: 'MyFont';
    src: url('MyFont.eot');
    src: url('MyFont.eot?#iefix') format('embedded-opentype'),
         url('MyFont.woff') format('woff'),
         url('MyFont.ttf') format('truetype'),
         url('MyFont.svg#MyFontRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

label { font-family: 'MyFont'; font-size: 20px; }

The label was just a test, but it's working. The font files are in the same directory as the CSS.

I've tried almost everything, and its still not working....

Does anybody know what's wrong? Any help appreciated.

Upvotes: 1

Views: 2110

Answers (2)

Patrick R
Patrick R

Reputation: 1979

I found out there was another CSS file, overwriting the one i made.

Problem solved

Upvotes: 1

Rich Bradshaw
Rich Bradshaw

Reputation: 72975

In order:

  1. Check if the font is on Google Web Fonts. If it is, use that version, don't embed your self (for ease of use, caching, browser update compat. etc.)

  2. If not, then check your MIMEs. To do this, use Firebug's Net panel to look at the headers and check they are correct.

  3. If the MIME is wrong, then fix it using either .htaccess, or by writing a PHP file that uses file_get_contents() and header() to fix it.

Upvotes: 2

Related Questions