My Font Face Doesn't Work

Question

I'm preaparing a simple web site. But my font-face doesn't work on Google Chrome.

My CSS codes:

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600);

body {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
}

My web.config data

<system.webServer>
    ...
    <staticContent>
      <remove fileExtension=".svg" />
      <remove fileExtension=".eot" />
      <remove fileExtension=".woff" />
      <remove fileExtension=".otf" />
      <mimeMap fileExtension=".svg" mimeType="image/svg+xml"  />
      <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
      <mimeMap fileExtension=".woff" mimeType="application/x-woff" />
      <mimeMap fileExtension=".otf" mimeType="font/otf" />
    </staticContent>
</system.webServer>

It works fine on Firefox but not fine on Chrome. I tried "fonts folder method" and "ttf fonts" on my project but it didn't change.

I have a suspicion about woff files but I can't change it.

How can I fix this?

Your web.config won't have any bearing on the matter, as that's for your server, but the font is being loaded from Google's server. How do you know it's not working? I loaded your site in Chrome and it looks like it's in Open Sans to me... In Chrome's tools, the computed style is, indeed, Open Sans. (See [here](http://updates.html5rocks.com/2013/09/DevTools-answers-What-font-is-that) to learn how to inspect the font that's really being used.) — Matt Gibson, Dec 16 '13 at 16:33

score 1 · Accepted Answer · answered Dec 16 '13 at 16:30

1

try use that - paste this link in head section:

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

answered Dec 16 '13 at 16:30

mcmac

1,042
9
13

or try this way `@import url('http://fonts.googleapis.com/css?family=Open+Sans:400,300,600');` – mcmac Dec 16 '13 at 16:34
Dude. Something has change. I think it is OK. I'm trying to understand. Check it out with CTRL + F5 – Mr. Zoidberg Dec 16 '13 at 16:36

score 1 · Answer 2 · edited Dec 16 '13 at 17:01

1

What version of chrome are you using? Seems to work fine on Version 31.0.1650.63.

body {
font-family: 'Open Sans', sans-serif;}

edited Dec 16 '13 at 17:01

Prashant Kumar

20,069
14
47
63

answered Dec 16 '13 at 16:36

Green Group Studio

23
5

My Font Face Doesn't Work

2 Answers2