bootstrap 3.2.0 glyphicons are not displaying in internet explorer

Ok, solved the Problem by myself.

The Problem was, that somehow my IE went in a certain security state, in which the font download was disabled.

So I changed the Custom level of the "protected Mode" - you can find that in the Security Tab of the Internet Options Menu.

After you click on the "Custom level..." Button you have to search for "font download" and change it to "enable".

Thanks for your help anyone!


For those of you who may be experiencing a similar issue, there is a bug in Internet Explorer which causes webfonts not to render under certain cache-control situations.

If the server is sending the header Pragma: no-cache and/or Cache-Control no-store, this will cause IE to fail to render the glyphs.

This took me hours to track down, so hopefully posting here will help others save time!


Like I mention in this thread: github

The problem is that, the browser (IE 11) need to recive:

  • static content files need to have Cache-Control and Pragma with "public, max-age=600"
  • angular requests need to have Cache-Control and Pragma with "no-cache"

In my app (.net core + angular)

app.js

var cacheConfig = function ($httpProvider) {

$httpProvider.defaults.headers.common["Cache-Control"] = "no-cache";
$httpProvider.defaults.cache = false;

if (!$httpProvider.defaults.headers.get) {
    $httpProvider.defaults.headers.get = {};
}

$httpProvider.defaults.headers.get["If-Modified-Since"] = "0";
};

Startup.cs

  app.UseStaticFiles(new StaticFileOptions
            {
                OnPrepareResponse = ctx =>
                {
                    ctx.Context.Response.Headers.Append("Cache-Control", "public,max-age=600");
                    ctx.Context.Response.Headers.Append("Pragma", "public,max-age=600");
                    //ctx.Context.Response.Headers.Append("ETag", DateTime.Now.Ticks.ToString());
                }
            });