title: Why is @font-face throwing a 404 error on woff files?
body: <p>I'm using <code>@font-face</code> on my company's site and it works/looks great. Except Firefox and Chrome will throw a 404 error on the <code>.woff</code> file. IE does not throw the error. I have the fonts located at the root but I've tried with the fonts in the css folder and even giving the entire url for the font. If remove those fonts from my css file I don't get a 404 so I know it's not a syntax error.</p>
  
  <p>Also, I used fontsquirrels tool to create the <code>@font-face</code> fonts and code:</p>
  
  <pre class="lang-css prettyprint-override"><code>@font-face {
    font-family: 'LaurenCBrownRegular';
    src: url('/laurencb-webfont.eot');
    src: local('☺'), 
      url('/laurencb-webfont.woff') format('woff'), 
      url('/laurencb-webfont.ttf') format('truetype'), 
      url('/laurencb-webfont.svg#webfontaaFhOfws') format('svg');
    font-weight: normal;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'FontinSansRegular';
    src: url('/fontin_sans_r_45b-webfont.eot');
    src: local('☺'), 
      url('/fontin_sans_r_45b-webfont.woff') format('woff'), 
      url('/fontin_sans_r_45b-webfont.ttf') format('truetype'), 
      url('/fontin_sans_r_45b-webfont.svg#webfontKJHTwWCi') format('svg');
    font-weight: normal;
    font-style: normal;
  }
  </code></pre>