Google Font not working on Safari

Question

I\'m working on making my site look the same under Safari and Chrome. In Chrome it looks exactly how I want it to. The major problem is that Google Font doesn\'t seem to be

Answer 1

My case was that I used font name without quotes. So just change

body{
    font-family: roboto, Arial, sans-serif;
}

to

body{
    font-family: 'roboto', Arial, sans-serif;
}

Chrome works perfectly without quotes, but Safari doesn't.

Answer 2

If you are using an @import code in the css like this

delete it and use link in head tag

Answer 3

For some odd reason I have experience this on some web fonts from Google...when this has happened I usually get them to my server and/or convert them in fontsquirrel....Safari should be able to take TTF Files no matter what ver:

Nunito TTF ver

Answer 4

Your CSS should not only contain

font-family: 'Source Sans Pro', sans-serif;

it should also have values for FONT-STYLE and FONT-WEIGHT:

font-family: 'Source Sans Pro', sans-serif; font-weight:900; font-style:italic;

in case you use a font that contains those values like for example: https://fonts.googleapis.com/css?family=Source+Sans+Pro:900italic

Answer 5

I had a case where a Google Webfont (Londrina) did not show up in Safari (for Windows), because I used text-rendering: optimizeLegibility;. After removing that, it was fine.

Example: http://codepen.io/julia-r/pen/gagbdy

Answer 6

Even though this is an old question I thought I would add my solution (that i found elsewhere) so as to help others.

When you declare your fonts in your CSS, add an "!important" at the end. It cleared up my problem.

body { font: {  
    family: $arvo, sans-serif !important;
    size: 18px;
}