title: CSS - Font Awesome show as rectangle
body: <p>I knew this issue already has been asked. I've checked what other said before but I couldn't solve my problem. Whenever I use this:</p>
  
  <pre><code>&lt;!-- Font Awesome --&gt;
  &lt;link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"&gt;
  </code></pre>
  
  <p>For FontAwsome, it works. but I want to add this to my directory so: here is my font's directory:</p>
  
  <p><a href="https://i.stack.imgur.com/4QoXF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/4QoXF.png" alt="enter image description here"></a></p>
  
  <p>And of course I added CSS file into my HTML:</p>
  
  <pre><code>    &lt;link rel="stylesheet" href="css/font-awesome.min.css"&gt;
       .
       .
       .
       &lt;div class="col-md-2 logobarItem"&gt;
          &lt;a href="#"&gt;text&lt;i class="fa fa-user"&gt;&lt;/i&gt;&lt;/a&gt;                      
       &lt;/div&gt;     
  </code></pre>
  
  <p>And here is my CSS directory:</p>
  
  <p><a href="https://i.stack.imgur.com/OxIld.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/OxIld.png" alt="enter image description here"></a></p>
  
  <p>Actually , in this situation , font awesome show like rectangle:
  <a href="https://i.stack.imgur.com/ZXEbo.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ZXEbo.png" alt="enter image description here"></a></p>
  
  <p>Any suggestion to solve it?</p>