title: FontAwesome showing squares, not icons
body: <p>My webpage is now showing squares for the icons, not the icons itself.</p>
  
  <p>I had the same page <code>Page1.html</code> (I "copy-pasted" the code to <code>Page2.html</code>), and Page2 is showing squares (with some characters inside ...), instead of icons.</p>
  
  <p>Well, I checked the console of Page2, and here's what I found:</p>
  
  <blockquote>
    <p>downloadable font: download failed (font-family: "FontAwesome" style:normal weight:normal stretch:normal src index:1): bad URI or cross-site access not allowed source: file:///D:/My Files/dist/font-awesome-4.4.0/fonts/fontawesome-webfont.woff2?v=4.4.0
    <code>font-awesome.min.css:4:14</code>
    <hr />
       downloadable font: download failed (font-family: "FontAwesome" style:normal weight:normal stretch:normal src index:2): bad URI or cross-site access not allowed source: file:///D:/My Files/dist/font-awesome-4.4.0/fonts/fontawesome-webfont.woff?v=4.4.0
    <code>font-awesome.min.css:4:14</code>
    <hr />
       downloadable font: download failed (font-family: "FontAwesome" style:normal weight:normal stretch:normal src index:3): bad URI or cross-site access not allowed source: file:///D:/My Files/dist/font-awesome-4.4.0/fonts/fontawesome-webfont.ttf?v=4.4.0
    <code>font-awesome.min.css:4:14</code>
    <hr />
       downloadable font: no supported format found (font-family: "FontAwesome" style:normal weight:normal stretch:normal src index:5) source: (end of source list)</p>
  </blockquote>
  
  <p>Example of code using FontAwesome:</p>
  
  <pre><code>&lt;ul class="navbar-nav"&gt;
    &lt;li&gt;
      &lt;a href="Home.html"&gt;&lt;span class="fa fa-home"&gt;&lt;/span&gt;Home&lt;/a&gt;
    &lt;/li&gt;
    ...
  &lt;/ul&gt;
  </code></pre>
  
  <p>I didn't modify anything on any FontAwesome files.</p>
  
  <p>Could this be the <code>normalize.css</code>, or any other stylesheets included in the webpage?</p>
  
  <hr />
  
  <p><strong>UPDATE</strong>:</p>
  
  <p>So, Page2 is in a folder in the same level as Page1:</p>
  
  <p>Page1: <code>My Files/Page1.html</code></p>
  
  <p>Page2: <code>My Files/includes/Page2.html</code></p>
  
  <p>... and my CSS Files: <code>My Files/dist/ (CSS Files)</code></p>
  
  <p>Now, I moved Page2 in the same folder as Page1, edited the <code>&lt;link href=""</code> parts of Page2, and the icons work as expected.</p>
  
  <p><em>What could be the problem here? ...</em></p>
  
  <hr />
  
  <ul>
  <li>Thanks, in advance! :)</li>
  </ul>