Results 1 to 3 of 3

Thread: CSS font-face from remote url?

  1. #1
    Join Date
    Nov 2009

    CSS font-face from remote url?

    I'm having an issue with @font-face in css. More specifically, I seems I can use a remote url to load the embeddable font.
    Here's my code:
    HTML Code:
    * A font by Jos Buivenga (exljbris) -> www.exljbris.nl */
    @font-face {
    	font-family: 'MuseoSlab500';
    	src: url('http://myremoteserver.com/museo_slab-webfont.eot');
    	src: local('☺'), 
    	url('http://myremoteserver.com/museo_slab-webfont.woff') format('woff'), 
    	url('http://myremoteserver.com/museo_slab-webfont.ttf') format('truetype'), 
    	url('http://myremoteserver.com/museo_slab-webfont.svg#webfont') format('svg');
    This does not work, however I am able to load the font if it is stored on the same server as my page. But, I am using BigCartel (shopping cart) which is a hosted service, and I can't upload anything except product images. So, I have to use a 3rd party server to load in all css images, etc.
    Does anyone have an idea why using a remote url doesn't work? And is there anyway to get around this?
    This has been a huge pain, and any help would be MUCH appreciated!

  2. #2
    Join Date
    Apr 2003
    Not permitted, see https://developer.mozilla.org/en/CSS/@font-face -> Notes
    In Gecko, web fonts are subject to the same domain restriction (font files must be on the same domain as the page using them), unless HTTP access controls are used to relax this restriction.
    Last edited by Fang; 05-10-2010 at 12:48 AM.
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Nov 2009
    Thanks Fang.
    I figured that out too. The only solution I found is to use fontsquirrel and use base64 encode to embed the font directly into my css file. This works in Gecko and Webkit, and IE doesn't seem to care if the font is on another domain.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
HTML5 Development Center