title: Bootstrap glyphicons not loading
body: <p>This question has been asked couple of times before, but I have never seen this situation I am in right now.</p>
  
  <p>I am making a website using the <code>codeigniter</code> framework in combination with <code>bootstrap</code> as a front-end framework. Therefor, my project tree roughly looks like this</p>
  
  <pre><code>MyProject/
  ├── application/
  ├── system/
  └── assets/
      └── bootstrap
          ├── 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>The <code>bootstrap.min.css</code> includes these fonts using font-face, like so:</p>
  
  <pre><code>@font-face {
      font-family: 'Glyphicons Halflings';
  
      src: url('/assets/bootstrap/fonts/glyphicons-halflings-regular.eot');
      src: url('/assets/bootstrap/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
           url('/assets/bootstrap/fonts/glyphicons-halflings-regular.woff2') format('woff2'), 
           url('/assets/bootstrap/fonts/glyphicons-halflings-regular.woff') format('woff'), 
           url('/assets/bootstrap/fonts/glyphicons-halflings-regular.ttf') format('truetype'), 
           url('/assets/bootstrap/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
  }
  </code></pre>
  
  <p>For some reason, the <code>css</code> just seems to skip that whole part, since the fonts not only do not work, they are also not shown in chrome's <code>developer tools</code> under the section network. It doesn't even show an error, it's not even in there.</p>
  
  <p>How can I fix this?</p>
  
  <p><strong>Edit 1</strong>
  I noticed the <code>src</code>'s <code>url</code> was incorrect, however it is just a minor mistake since this does not have anything to do with the fact that the errors don't show in chrome's <code>developer tools</code></p>
  
  <p><strong>Edit 2</strong>
  After loads of more trying, I noticed it didn't work in a very basic html either, being this:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;title&gt;Hello&lt;/title&gt;
  
          &lt;link href="//netdna.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"&gt;
  
      &lt;/head&gt;
      &lt;body&gt;
          &lt;p&gt;&lt;span class="glyphicons glyphicons-search"&gt;&lt;/span&gt; Hello&lt;/p&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Then I started researching some more of this strange behaviour and stumbled across this link, where it is stated that in v4.0, glyphicons are removed from bootstrap. That is why I think the glyphicons are removed from bootstrap all together.</p>
  
  <p>If you think I am wrong and see the mistake I am making, please do reply.</p>