Why is my @font-face code working in Chrome but not Safari (4) or Firefox (3.6.13)?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • DruidFluid
    New Member
    • Jan 2011
    • 7

    #1

    Why is my @font-face code working in Chrome but not Safari (4) or Firefox (3.6.13)?

    Hello, I’m using Paul Irish’s “bulletpro of” @font-face code and a premade font kit from fontsquirrel.co m on my tumblr template. The @font-face code seems to work fine in Chrome but not in Safari or Firefox. It just reverts to Arial.

    I know Firefox can have problems if the files are hosted on different domains but mine are not.
    Also, I’ve visited a lot of other sites that have identical codes to mine and they seem to be working fine. I also tried using ‘Base64′ Encoding on the “fontsquir rel @font-face generator” that embedded the .ttf into the actual css but I deleted it after it failed also. It’s weird because that method was used by the actual creator of the template I adapted.

    I’m entirely stumped.

    Here is the code I am using:
    Code:
    @font-face {
    	font-family: 'OldNewspaperTypes';
    	src: url('http://static.tumblr.com/swm4hby/0Jaleopd0/oldnewspapertypes.eot');
    	 src: local('☺'),
            url('http://static.tumblr.com/swm4hby/38Fleon4l/oldnewspapertypes-webfont.woff') format('woff'), url('http://static.tumblr.com/swm4hby/GkZleomml/oldnewspapertypes.ttf') format('truetype');
    }
    
    
    @font-face {
    	font-family: 'ComicZineOTRegular';
    	src: url('http://static.tumblr.com/swm4hby/B42leopds/comic_zine_ot-webfont.eot');
    	src: local('☺'), url('http://static.tumblr.com/swm4hby/eBDleopd1/comic_zine_ot-webfont.woff') format('woff'), url('http://static.tumblr.com/swm4hby/b30leos6c/comic_zine_ot-webfont.ttf') format('truetype') ;
    	
    }
    Here is a link to my tumblr page: (excuse expletives in test posts)


    Here is a link to my entire code w/embedded css:


    here is a separate link to my css stylesheet:


    I’ve really managed to confuse myself....any help or ideas would be greatly appreciated!
    Thanks in advance.
  • DruidFluid
    New Member
    • Jan 2011
    • 7

    #2
    I noticed an error, changed it, but my problem is still the same. All above coding is current.

    Comment

    • Dormilich
      Recognized Expert Expert
      • Aug 2008
      • 8694

      #3
      when I try to open http://static.tumblr.com/swm4hby/0Ja...papertypes.eot manually, I get an Access Denied Error …

      Comment

      • AutumnsDecay
        New Member
        • Mar 2008
        • 170

        #4
        Same here. Is fontsquirrel a site that requires a login to access free fonts?

        Comment

        • drhowarddrfine
          Recognized Expert Expert
          • Sep 2006
          • 7434

          #5
          If the fonts are on the server, use relative URIs and not absolute.

          Comment

          • DruidFluid
            New Member
            • Jan 2011
            • 7

            #6
            I fixed some embarrassingly obvious conflicting errors, used different font kits, and tried relative and absolute URIs - but nothing changed. Thank you for your suggestions.... I guess I'll keep researching.

            Comment

            • DruidFluid
              New Member
              • Jan 2011
              • 7

              #7
              I solved the Safari problem by hosting my files outside of tumblr and changing apostrophes to quotes around my filenames. No luck with Firefox though...

              Comment

              Working...