title: @font-face not working with specific version of Internet Explorer 11
body: <p>I know there are lots of similar questions but this situation seems really odd. @font-face seems to be broken for Internet Explorer 11 (Windows 7 Pro). Specifically, Version: <strong>11.0.9600.17728</strong>, Update Version: <strong>11.0.18</strong>.</p>
  
  <p>@font-face is working fine for me on Chrome, Firefox, Safari, Opera (both Linux and Windows, where applicable). In fact, it's even working on Internet Explorer Version: <strong>11.0.9600.17633</strong>, Update Version: <strong>11.0.16</strong>, also running on Windows 7 on a different machine I have.</p>
  
  <p>There is nothing in the developer console to indicate that there is any problem fetching the fonts. I've simplified my html/css down to some very basic stuff to reproduce the problem. In the case below, neither of the custom fonts are working (for that specific IE version):</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;link rel="stylesheet" type="text/css" href="test.css" /&gt;
  &lt;/head&gt;   
  &lt;body&gt;      
      &lt;p&gt;This font should be Roboto Thin&lt;/p&gt;
      &lt;p&gt;There should be icons below. If not, then font-face is not working.&lt;/p&gt;
      &lt;span&gt;a&lt;/span&gt;
      &lt;span&gt;b&lt;/span&gt;
      &lt;span&gt;c&lt;/span&gt;
      &lt;span&gt;d&lt;/span&gt;
      &lt;span&gt;e&lt;/span&gt;
      &lt;span&gt;f&lt;/span&gt;
      &lt;span&gt;g&lt;/span&gt;
      &lt;span&gt;h&lt;/span&gt;
      &lt;span&gt;i&lt;/span&gt;
      &lt;span&gt;j&lt;/span&gt;
      &lt;span&gt;k&lt;/span&gt;
      &lt;span&gt;l&lt;/span&gt;
      &lt;span&gt;m&lt;/span&gt;   
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>...and the CSS:</p>
  
  <pre><code>@charset "UTF-8";
  
  @font-face {
      font-family: 'robotothin';
      src: url('roboto-thin-webfont.eot');
      src: url('roboto-thin-webfont.eot?#iefix') format('embedded-opentype'),
           url('roboto-thin-webfont.woff') format('woff'),
           url('roboto-thin-webfont.ttf') format('truetype'),
           url('roboto-thin-webfont.svg#robotothin') format('svg');
      font-weight: normal;
      font-style: normal;
  }
  
  @font-face { 
      font-family: 'typicons'; 
      src: url('typicons-regular-webfont.ttf'); 
  }
  
  p {
      font-family: robotothin;
      font-size: 26px;
      color: #666;
  }
  
  span {
      font-family: typicons;
      font-size: 30px;
      color: #0062A8;
  }
  </code></pre>
  
  <p>You can find that <a href="http://www.redbrick.dcu.ie/~elzilcho/font-test/test.html" rel="noreferrer">code running here</a>.<br>
  If I view that page using the version of IE causing problems, the text font will be the default and instead of icons you'll only see the letters in the <code>span</code> tags.  </p>
  
  <p>Given that @font-face is working in every other browser I've tested (even different version of IE 11) is this likely to be a bug with that version of IE, and is there anything I can do to fix or debug further?</p>