title: Why is my logo not showing up on my navbar, but other logo yes?
body: <p>I've been trying to create a navbar, but when I load my website in localhost, I can't seem to see my logo on the navbar. So I went searching on the web to get an example to see if my logo was the problem. In this first example ( took from the web I can see their logo loading)</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>    *{transition:all 0.3s ease-in-out;}
      
      .container{
        clear:both;
        overflow:auto;
      }
      
      nav{float:right;}
      
      .logo img{float:left;}
      
      ul li{
        display: inline-block; padding:10px;
        font-size:20px; font-family:raleway;
      }
      
      ul li:hover{
        color:orange;
        
      }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;div class="container"&gt;
      &lt;div class="logo"&gt;
        &lt;img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/c9/Intel-logo.svg/2000px-Intel-logo.svg.png" alt="" width="130"/&gt;
        &lt;/div&gt;
      &lt;nav&gt;
        &lt;ul&gt;
        &lt;li&gt;Home&lt;/li&gt;
        &lt;li&gt;Services&lt;/li&gt;
        &lt;li&gt;Products&lt;/li&gt;
        &lt;li&gt;Clients&lt;/li&gt;
        &lt;/ul&gt;
        &lt;/nav&gt;
      &lt;/div&gt;
      &lt;hr /&gt;</code></pre>
  </div>
  </div>
   </p>
  
  <p>Then all I did is put the direct link of my imgur image to replace their logo by mine and when I load it, it doesn't show up. How come?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>    *{transition:all 0.3s ease-in-out;}
      
      .container{
        clear:both;
        overflow:auto;
      }
      
      nav{float:right;}
      
      .logo img{float:left;}
      
      ul li{
        display: inline-block; padding:10px;
        font-size:20px; font-family:raleway;
      }
      
      ul li:hover{
        color:orange;
        
      }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="container"&gt;
      &lt;div class="logo"&gt;
        &lt;img src="https://i.imgur.com/jSo9sj9.png" alt="logo" width="130"/&gt;
        &lt;/div&gt;
      &lt;nav&gt;
        &lt;ul&gt;
        &lt;li&gt;Home&lt;/li&gt;
        &lt;li&gt;Services&lt;/li&gt;
        &lt;li&gt;Products&lt;/li&gt;
        &lt;li&gt;Clients&lt;/li&gt;
        &lt;/ul&gt;
        &lt;/nav&gt;
      &lt;/div&gt;
      &lt;hr /&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Thank you for your help.</p>