Google fonts not working in 2 of 5 browsers

Question

Good afternoon. I am very new to this community and this is my first question here. I've been learning HTML and CSS for the past month and I've come across my first situation where I haven't been able to find an answer on this awesome site! (I'm found a few questions and answers but nothing specific to my situation so your assistance would be greatly appreciated)

I am using Notepad++ to write a website and have the following included in the head

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

and then in the CSS I have:

font-family: 'Tangerine', serif;

Now the reason I am so confused is because the font loads perfectly on Chrome, Opera and Safari, but not in IE or Firefox?! As i said I cannot find a specific answer to this question so anything I've missed that you can point out would be much appreciated. Do google fonts not work on IE or Firefox locally maybe??

Thanks again

Shane

UPDATE: I am using the latest version of all the browsers; I just downloaded Firefox and IE today.

Answer 1

That's because this fond is only providing a woff file:

src: local('Tangerine'), url(http://themes.googleusercontent.com/static/fonts/tangerine/v4/HGfsyCL5WASpHOFnouG-RLO3LdcAZYWl9Si6vvxL-qU.woff) format('woff');

You need their other browser alternatives, such as svg, eot. Although in most modern browsers, it'll work fine - there are browsers and versions that don't support it. If the two browsers you've tested in say they have support, then we'd need a test page that we can look at.