Google Font not working on Safari

css safari google-font-api
Juicy picture Juicy · Jun 5, 2014 · Viewed 65.4k times · Source

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 loading under Safari. Because I'm using the exact code given on the Google Font site, I can't understand why Safari won't fetch it. Is it just incompatible with Safari and I have to rely on a fallback font?

The site can be found here

Answer

Robert picture Robert · Nov 27, 2015

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

Related questions

How to remove the border highlight on an input text element

When an HTML element is 'focused' (currently selected/tabbed into), many browsers (at least Safari and Chrome) will put a blue border around it. For the layout I am working on, this is distracting and does not look right. <…

Read More
is there a css hack for safari only NOT chrome?

im trying to find a css hack for just safari NOT chrome, i know these are both webkit browsers but im having problems with div alignments in chrome and safari, each displays differently. i have been trying to use this …

Read More
How can I force WebKit to redraw/repaint to propagate style changes?

I have some trivial JavaScript to effect a style change: sel = document.getElementById('my_id'); sel.className = sel.className.replace(/item-[1-9]-selected/,'item-1-selected'); return false; This works fine with the latest versions of FF, Opera and IE, but …

Read More