CSS Background Image Trouble

Question

html:

<div id="Home"></div>

css:

#Home {
position: relative;
background: url("../Pictures/GoodAssTunes.jpg") ;
height: 800px;
width: 100%;
margin-left: -8px;
margin-top: -8px;
z-index: 1;
background-size: 100%;

}

But it wont display for some reason. I've tried it with background: and background-image: with the shorthand and just url("GoodAssTunes.jpg"). But it doens't work.

• Ming: There's nothing wrong with your code, are you sure your image is in the spot you say it's in? Alternatively, have you opened it up to see if the image is corrupt?
• Andrew Newby: Try looking in Firebug, to see if the image is coming up as a 404
• jkell311: code is good! Check the case as sometimes CSS can be sensitive to filename formatting

Answer 1

http://jsfiddle.net/JD2ft/ It works fine see

No problem check with Pictures/GoodAssTunes.jpg

 #Home {
 position: relative;
 background: url("http://placehold.it/350x150") ;
 height: 800px;
 width: 100%;
 margin-left: -8px;
 margin-top: -8px;
 z-index: 1;
 background-size: 100%;
 }

Answer 2

Open Google Crome

rightclick open view page source or Inspect element

and see the link

it should open the image