title: background images, among other things wont show online but work locally
body: <p>I realize this has been asked a trillion times, but I can't seem to get my background image to show up online. it was working fine locally. </p>
  
  <p>I used a relative path name to Banner_hd.jpg in my img folder, while my css was in my css folder.</p>
  
  <p>background-image: url(../img/Banner_hd.jpg) no-repeat center center fixed;</p>
  
  <p>I tried with and without quotes, i tried image-url instead of just url, background instead of background-image, I tried converting to png, and renaming to banner.jpg. I also tried a url to the web address like url(<a href="http://myweb.com/img/Banner_hd.jpg" rel="nofollow">http://myweb.com/img/Banner_hd.jpg</a>) and still no luck.</p>
  
  <p>what else can I try? when I used page inspector I found the image had a 404 not found error and was listed as html/text, while only one image seemed to come up properly, though not sure why.</p>
  
  <p>Please let me know if I can provide more relevant info, thanks!</p>
  
  <p>heres the relevant code:</p>
  
  <pre><code>   html:
  
  &lt;div class="cover"&gt;
  
          &lt;div class="cover-text"&gt;            
              &lt;img src="img/sm.jpg" class="img-circle"&gt;          
              &lt;img src=" img/Logo-new.png " class="logo"&gt;        
        &lt;/div&gt;
      &lt;/div&gt;
  
  css:
  
  .cover {
      background-image: url('../img/Banner_hd.jpg') no-repeat center center fixed;
      background-size: cover;
      display: table;
      width: 100%;
      height: 100%;    
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
  }
  </code></pre>