Solved

Webfont not loading only in IE11, Windows 8.1 version

Posted on 2014-02-18
2
9,034 Views
Last Modified: 2016-10-20
Hello, I have a problem with this website and I'm at a total loss:

http://www.cirworld.eu

Aside from some quirks, it's working fine on all browsers, except IE11 on W8.1.

The problem is with webfonts. They just won't load with that browser/OS combination.

The site is built with Wordpress and a theme I heavily modified.

The css for the webfonts was originally:

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300italic,300,400italic,600,600italic,700,700italic,800,800italic);
font-family: 'Open Sans', sans-serif;
@import url(http://fonts.googleapis.com/css?family=Philosopher:400,400italic,700,700italic);
font-family: 'Philosopher', sans-serif;

Open in new window


at the beginning of the style.css file.

I changed this to:

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

Open in new window


I wanted to use this gabriola font I bought but I kept the name Philosopher to avoid changing too many lines of code.

Anyway, my webfont doesn't show up in IE11/W8.1.

Google fonts didn't show up either (not even in IE11/W7, actually), until I added this to the header of the theme:

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

Open in new window


I hope someone can help me because I don't know how I may add this web font in a way that IE11/W8.1 recognizes it too...
0
Comment
Question by:Daniele Brunengo
2 Comments
 

Accepted Solution

by:
Daniele Brunengo earned 0 total points
ID: 39868260
Solved it. Looks like IE11 is the ONLY browser needing the font's declared name to match the font's name as stored into the font itself, or something. Anyway, changing everything from Philosopher to Gabriola fixed it.
0
 

Expert Comment

by:Robert Beach
ID: 41852980
Thanks! This also fixed the same problem in other IE versions.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Now-a-days, indirectly, postal services have been replaced by email services. Yes, whenever we hear the word "email" a lot of people only think of gmail. Some people still think that email and gmail are one and the same thing :-). Let's see some …
In threads here at EE, each comment has a unique Identifier (ID). It is easy to get the full path for an ID via the right-click context menu. However, we often want to post a short link within a thread rather than the full link. This article shows a…
The purpose of this video is to demonstrate how to add AdSense Ads to a WordPress Website, and how to set up WordPress to automatically place Ads in Sidebars. This will be demonstrated using a Windows 8 PC. Log into your AdSense account. : Cli…
The purpose of this video is to demonstrate how to Test the speed of a WordPress Website. Site Speed is an important metric of a site’s health. Slow site speed can result in viewers leaving your site quickly and not seeing your content. This…

680 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question