Mi sitio web tiene una fuente que no es compatible/reconocida en Firefox

My website is not showing the appropriate font, PT Sans.ttc. I checked on other browsers and it works fine.

www.farmap-ux.com. Below is CSS code.

@font-face
{
font-family: PT Sans;
font-family: font-family: 'PT Sans', sans-serif;
src: url("http://fonts.googleapis.com/css?family=PT+Sans")
}

So it works on everything like I said (Chrome, Safari, even Opera!) Any ideas? I've tried to find .woff files for the font but I don't think it's in my Font Book.

preguntado el 09 de enero de 13 a las 22:01

Your site link doesn't seem to work... at least it doesn't for me. -

Could it be that your CSS is invalid? It doesn't seem valid to me. First, you're using PT Sans without quotes, and then you're repeating font-family: . And you miss a semicolon at the end of the src: línea. -

Follow the directions at google.com/webfonts#UsePlace:use/Collection:PT+Sans to set up the font again on your website. -

4 Respuestas

Maybe it's because your @font-face declaration isn't valid at all. It should be something like:

@font-face
{
    font-family: 'PT Sans';
    font-style: normal;
    font-weight: 400;
    src: local('PT Sans'), local('PTSans-Regular'), url(http://themes.googleusercontent.com/static/fonts/ptsans/v4/LKf8nhXsWg5ybwEGXk8UBQ.woff) format('woff');
}

However, it's even better to use the CSS file provided by google:

<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=PT+Sans">

If you want to stick to a CSS import use

@import url(http://fonts.googleapis.com/css?family=PT+Sans);

Respondido el 09 de enero de 13 a las 22:01

that didn't work either; you can preview this in firefox but it doesn't actually work in firefox - farmanp

You should really check your css! The syntaxe is miles away from correct.

También, trabaja para http://fonts.googleapis.com/css?family=PT+Sans is already a css file! what you should do is import is put it directly into the <head> your html using the link etiqueta.

Echa un vistazo a este ejemplo: http://www.w3schools.com/tags/tag_link.asp, or just add the following to your html file as said before.

<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=PT+Sans">

Respondido el 09 de enero de 13 a las 22:01

Siguiendo las instrucciones en Google Webfonts debería solucionar su problema.

First, make sure you're including the Google CSS necessary to reference the font files. You have the option to include a LINK tag in your HTML, a @import directive in your CSS, or some Javascript. I recommend the LINK tag for maximum browser compatibility:

<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>

When adding this CSS to your site, Google will automatically determine the correct font type to use for your browser. Not all browsers use WOFF files. Older versions of IE use EOT files, some browsers prefer SVG or TTF. Google is able to sniff for the browser type and modify the included CSS as necessary.

After Google's CSS is included, you only have to reference the font family in your CSS where you want the font to appear.

font-family: 'PT Sans', sans-serif;

That's the only CSS necessary. Remove all the other CSS you linked… as mentioned in the other answers your CSS has some errors.

Respondido el 09 de enero de 13 a las 22:01

Tratar:

@font-face {
  font-family: 'PT Sans';
  font-weight: normal;
  src: url("http://fonts.googleapis.com/css?family=PT+Sans");
}

Respondido el 09 de enero de 13 a las 22:01

The url isn't a valid font file but a @font-face declaración. - Zed

it works as a preview, but it doesn't work when actually being used on firefox for some reason. I don't understand why it does it like that. - farmanp

Otherwise use the solution Zeta suggested: <link href='fonts.googleapis.com/css?family=PT+Sans:400,700'rel =' hoja de estilo 'tipo =' texto / css '> - André Zimpel

when I say preview I mean I can view the local file when I edit it on Dreamweaver - farmanp

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.