Font family not working in IE9 (but all other IEs)

[Senff]

I’m kinda embarrassed that I have to ask this, but can anyone point me in the right direction why my font-family declaration of “Alternate Gothic” is not working in IE9? It’s fine in other IEs.

Site: http://www.senff.com
Fonts: all article titles and also sidebar title (“NEW SITE, RESPONSIVE AND ALL!” and such)

I’ve used the following code:

@font-face {
font-family: ‘alternategothic’;
src: url(‘../fonts/alternate_gothic.eot’); /* IE9 Compat Modes */
src: url(‘../fonts/alternate_gothic.eot?#iefix’) format(’embedded-opentype’), /* IE6-IE8 */
url(‘../fonts/alternate_gothict.woff’) format(‘woff’), /* Modern Browsers */
url(‘../fonts/alternate_gothic.ttf’) format(‘truetype’), /* Safari, Android, iOS */
url(‘../fonts/alternate_gothic#alternategothic’) format(‘svg’); /* Legacy iOS */
}

I’ve checked if http://newww.senff.com/wp-content/themes/senff/fonts/alternate_gothic.eot is there, and I’d say it is. Tried some solutions that Google is giving me, but didn’t see any that might have been the problem. I’m also not at home so I can’t fully test/try things….so if anyone sees what it could be, please let me know.

Thanks for your help!

[chrisburton]

@Senff Try giving the IE6-IE8 fix an absolute URL. See if that works. But it seems like a bad URL.

[Andy Howells]

Official error from the IE9 console is;

CSS3117: @font-face failed cross-origin request. Resource access is restricted.

[Senff]

@chrisburton: tried it, doesn’t seem to work. Full path is http://newww.senff.com/wp-content/themes/senff/fonts/alternate_gothic.eot , looks like that’s the correct path so I’m not sure why it would be a bad URL?

See http://newww.senff.com/wp-content/themes/senff/stylesheets/default.css

[chrisburton]

http://cloud.chrisburton.me/LqsI

Fix this line:

url(‘../fonts/alternate_gothic.eot/fonts/alternate_gothict.woff’) format(‘woff’), /* Modern Browsers */

[Andy Howells]

Have you done all the mime type related gumpf in your .htaccess?

[Senff]

@chrisburton : i think that slipped in when I was trying to “fix” things, but even when it’s corrected now, no dice.

@andy_unleash : I haven’t done anything in .htaccess — but then again, I never had to before. This is the first time I ever had problems with font-family on my site, ever. All other sites running never had any issues.

BUT! That led me to try something. It seems that it’s all working fine when I go to http://newww.senff.com directly; looking at the site on that location, it’s all working now. So it’s clear that there is a problem with the “connection” between www.senff.com and newww.senff.com.

(Reason is that my site is located in the folder “newww” but that I don’t want people to have to enter that folder name in the URL)

So there’s definitely something wrong with that forwarding thing, when WordPress is not in the root of the site but I set it to have the HOME url in the root and not the main WordPress location and bla bla bla…..confusing to say the least. I think I’m just going to move everything to the root again, less confusing and such.

So anyways, it’s working for now, even though there’s other things that’s not that great. Menu is not sticky in IE9 for example but I can’t be all too bothered to look into that right now.

Thanks guys for helping me :)

[Andy Howells]

@senff – now you’ve explained the site structure the error makes sense. Basically it’s IE9 cross domain blocking. Reading on StackOverflow apparently adding this to HTAccess can cure the issue;

Header set Access-Control-Allow-Origin “*”

[Senff]

@andy_unleash I’ll give that a try.

EDIT: never mind previous long reply. Will use http://www.senff.com/newww instead of newww.senff.com (point to the same folder anyway)!

[chrisburton]

@senff I think @andy_unleash had the answer with htaccess.

[Senff]

@Chrisburton : indeed. So to recap: the site was located on www.senff.com, whereas the stylesheets (and fonts) were located on newww.senff.com. Because of the different domains, IE9 basically said “neh, can’t display those fonts from a different domain on your site there!“

.htaccess could have fixed that but I’d rather elimate any problems altogether, than to fix them. :)

[tannercampbell]

@ChrisBurton relevant???

[chrisburton]

@tannercampbell It is. Don’t you have this in your htaccess already?

[Author]

Posts