Databases
StackOverflow2013
Postsdbo
POCSS @font-face not working with Firefox, but working with Chrome and IE
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS @font-face not working with Firefox, but working with Chrome and IE
    text
    copied!<p>The following code works in Google Chrome beta as well as IE 7. However, Firefox seems to have a problem with this. I'm suspecting it to be a problem of how my CSS files are included, cause I know Firefox is not too friendly about cross-domain imports.</p> <p>But this is all just static HTML and there's no question of cross-domain.</p> <p>On my landing-page.html I do a CSS import like so:</p> <pre><code>&lt;link rel="stylesheet" href="../css/main.css" type="text/css" media="screen, projection" /&gt; </code></pre> <p>Within the main.css I have another imports like so:</p> <pre><code>@import url("reset.css"); @import url("style.css"); @import url("type.css"); </code></pre> <p>and within the type.css I have the following declarations:</p> <pre><code>@font-face { font-family: "DroidSerif Regular"; src: url("font/droidserif-regular-webfont.eot"); src: local("DroidSerif Regular"), url("font/droidserif-regular-webfont.woff") format("woff"), url("font/droidserif-regular-webfont.ttf") format("truetype"), url("font/droidserif-regular-webfont.svg#webfontpB9xBi8Q") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "DroidSerif Bold"; src: url("font/droidserif-bold-webfont.eot"); src: local("DroidSerif Bold"), url("font/droidserif-bold-webfont.woff") format("woff"), url("font/droidserif-bold-webfont.ttf") format("truetype"), url("font/droidserif-bold-webfont.svg#webfontpB9xBi8Q") format("svg"); font-weight: normal; font-style: normal; } body { font-family: "DroidSerif Regular", serif; } h1 { font-weight: bold; font-family: "DroidSerif Bold", serif; } </code></pre> <p>I have a directory called "font" in the same location as type.css. This font directory contains all the woff/ttf/svg files etc.</p> <p>I'm stumped on this one. <strong>It works in Chrome and IE but not on Firefox</strong>. How is this possible? What am I missing?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload