@font-face does not work in Firefox, but in IE and Chrome they work

Asked

Viewed 2,650 times

2

Always use @font-face in my projects and never had this problem.

I have doubts if you have a problem with my CSS.

The @font-face not working on Firefox.

My code is like this.

<link rel="stylesheet" type="text/css" href="css/fonts.css">

The CSS of @font-face is in the folder fonts

   @font-face {
    font-family: 'futura_mdcn_btmedium';
    src: url('../fonts/futura_medium/futura_mdcn_bt_medium-webfont.eot');
    src: url('../fonts/futura_medium/futura_mdcn_bt_medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/futura_medium/futura_mdcn_bt_medium-webfont.woff') format('woff'),
         url('../fonts/futura_medium/futura_mdcn_bt_medium-webfont.ttf') format('truetype'),
         url('../fonts/futura_medium/futura_mdcn_bt_medium-webfont.svg#futura_mdcn_btmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

And in my CSS style it’s like this:

  p{
    font-family:'futura_mdcn_btmedium' Arial, Helvetica, sans-serif;    
        }
    body{
    font-family:'futura_mdcn_btmedium' Arial, Helvetica, sans-serif;        
    }

I have a folder called fonts and inside this folder contains a subfolder futura_medium there are all Woff/ttf/svg files etc.

Did I forget something?

3 answers

1


Which version of Firefox you use?

Maybe he is not finding his folder, try to put another '.. /' in front.

And there’s a comma missing there in your code, after the name of your font, before 'Arial'.

Did you try a hack? This site here has a hack of the FF, a look who knows help. http://browserhacks.com/

  • Jefferson Alison, Solved I never imagined that it would be a stupid thing a primary mistake on my part, I ignored the comma why I tested in various browsers Chrome, Ie, rock melt, Safary, Opera and everyone was normal just in firefox happened this. I appreciate the help

  • It is already spent hours and hours looking for where was missing the comma or point and comma.. hehe, is part friend.

0

Some suggestions:

-Are you sure you don’t have any plugin that changes the pages in Firefox. (this has already happened to me)

-Try other ways to inform the location, using "~/" instead of ".../".

0

Did you notice the error console? Usually the problem with fonts in firefox has to do with the lack of declaration of Mimetype or CORS.

// Declara MimeType
AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff

// Permite servir fonte para outros dominios
<FilesMatch "\.(ttf|otf|eot|woff)$">
    <IfModule mod_headers.c>
        Header set Access-Control-Allow-Origin "*"
    </IfModule>
</FilesMatch>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.