title: Bootstrap CSS not loading fonts correctly when hosted locally
body: <p>I currently have a webapp that currently looks something like this</p>
  
  <p><strong>Directory</strong>:</p>
  
  <pre><code>|-- index.jsp
  |-- css
       |-- bootstrap.min.css
  |-- fonts
       |-- glyphicons-halflings-regular.eot
       |-- glyphicons-halflings-regular.svg
       |-- glyphicons-halflings-regular.ttf
       |-- glyphicons-halflings-regular.woff
       |-- glyphicons-halflings-regular.woff2
  </code></pre>
  
  <p><strong>index.jsp</strong>:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;html&gt;
  &lt;head&gt;
     &lt;title&gt;Login&lt;/title&gt;
     &lt;link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" /&gt;
     &lt;link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"&gt;
     &lt;!-- &lt;link rel="stylesheet" href="css/bootstrap.min.css" /&gt; --&gt;
     &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
     &lt;script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"&gt;&lt;/script&gt;
     &lt;script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"&gt;&lt;/script&gt;
     &lt;!-- &lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt; --&gt;
  &lt;/head&gt;
  &lt;body&gt;
     &lt;input id="username" name="username" class="required" tabindex="1" placeholder="Username" type="text" /&gt;&lt;span id="usernameTip" data-toggle="tooltip" data-placement="right" class="glyphicon glyphicon-question-sign"&gt;&lt;/span&gt;
     &lt;input id="password" name="password" class="required" tabindex="2" placeholder="Password" type="password" /&gt;&lt;span id="passwordTip" data-toggle="tooltip" data-placement="right" class="glyphicon glyphicon-question-sign"&gt;&lt;/span&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Temporarily, I'm using CDNs for my library files, but I'd like to be hosting the files locally. However, when I use the Bootstrap file locally, specifically the CSS, the glyphicons aren't appearing in IE10. After digging around a whole bunch, I noticed a discrepancy between when bootstrap.min.css was hosted on a CDN versus locally.</p>
  
  <p>This is what I see when I use the IE Developer Tools in the Network tab</p>
  
  <p>bootstrap.min.css from maxcdn:</p>
  
  <pre><code>https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/fonts/glyphicons-halflings-regular.eot?#iefix   HTTPS   GET 200 application/vnd.ms-fontobject   20.14 KB    47 ms   @font-face  296 0   32  15  0   0
  </code></pre>
  
  <p>bootstrap.min.css from local directory:</p>
  
  <pre><code>/fonts/glyphicons-halflings-regular.eot?    HTTPS   GET 200     19.94 KB    31 ms   @font-face  2667    0   16  15  0   16
  /fonts/glyphicons-halflings-regular.woff    HTTPS   GET 200     23.16 KB    &lt; 1 ms  @font-face  2698    0   0   0   0   16
  /fonts/glyphicons-halflings-regular.ttf HTTPS   GET 200     44.62 KB    16 ms   @font-face  2698    0   16  0   0   0
  </code></pre>
  
  <p>I believe this is the root of the issue but I can't understand what would be causing it. I'm using the same version of Bootstrap locally, 3.3.2, and I noticed the issue occurs regardless of whether or not any of the other library files are hosted locally or on CDNs. Any combination of jQuery, jQueryUI, and Bootstrap sourced either externally or internally made no difference, except for when it was bootstrap.css.</p>
  
  <p>Anyone able to shed some light on this issue?</p>