External CSS font face only showing in Chrome (no IE and Firefox) -


i have font-face css:

<style> @font-face { font-family: 'museo_slab500'; src: url('/css/fonts/museo_slab_500-webfont.eot'); src: url('/css/fonts/museo_slab_500-webfont.eot?#iefix') format('embedded-opentype'),         url('/css/fonts/museo_slab_500-webfont.woff') format('woff'),         url('/css/fonts/museo_slab_500-webfont.ttf') format('truetype'),         url('/css/fonts/museo_slab_500-webfont.svg#museo_slab500') format('svg'); font-weight: normal; font-style: normal; } </style> 

quite straightforward. problem is:

  • if keep font-face definition alone in .css file (and font-family applied various headings, body in .css file) don't see font applied in browser. checked firebug, read, font downloaded not applied.
  • if move font-face definition external .css file , put inline in html shows correctly.

if remove above code inline inside page , put in external .css , put instead of style tags:

        <link type="text/css" rel="stylesheet" href="/adminskin/default/css/font-families.css" /> 

. hint on why happens? i'm going crazy.

ok ..... found answer madness.

it seems while google chrome has no problems @ all, both ie , firefox (didn't try safari or opera) can't cope absolute url pointing external .css font face definition. while works in browser (inside .css font-face definition)

<link rel="stylesheet" type="text/css" href="/skinadmin/default/css/font-families.min.css?v=2.0.0.0" /> 

this works in google chrome.

<link rel="stylesheet" type="text/css" href="http://www.yoursite.com/skinadmin/default/css/font-families.min.css?v=2.0.0.0" /> 

isn't madness? think is.


Comments

Popular posts from this blog

ios - iPhone/iPad different view orientations in different views , and apple approval process -

java Extracting Zip file -

C# WinForm - loading screen -