Hi All,
I've been struggling with this problem for the better part of 2 weeks. (Trying to help an aunt with a website.) I just can't seem to discover the issue. I've simplified the scenario to a very basic site just for the ease of troubleshooting. But I cannot get the image to display via the style.css. After I take a look at the code in Firebug I get the error "Failed to load the given url". I've tried using file, double quotes, single quotes, no quotes, but just cannot get this to display. Any insight would be appreciated. I'd consider myself a beginner after reading through some of the discussions here so please keep that in mind.
Below is the index.HTML which cannot display the CSS background-image in the HEADER DIV.
<html>
<link rel="stylesheet" type="text/css" href="style.css">
<head>
</head>
<title>
Test Site
</title>
<body>
<div id="container"></div>
<div id="header"><p>This is the header</div>
<div id="sidebar"><p>Home</p>
<p>Link 1</p>
<p>Link 2</p>
</div>
<div id="content"><p> Content Goes Here</p></div>
<div id="footer"></div>
</body>
</html>
This is the style.css I am working with.
body {background: #ffffff; margin: 0; padding: 0;}
a {color: #2b2bf6;}
#container {
width: 900px;
margin: 0;
padding: 0;
background: #dddddd;
}
#header {
width: 900px;
height: 150px;
background: url("/images/1.jpg");
border-bottom:2px solid #000000;
}
#sidebar {
float:left;
width: 200px;
height: 400px;
margin: 0;
padding: 0;
border: 0;
float: left;
background: #f0e811;}
#content {
width: 700px;
height: 400px;
margin: 0;
padding: 0;
border: 0;
float: left;
background: #5882FA;}
#content p {
font-family: Arial;
font-size: 14px}
#footer {
width: 900px;
height: 70px;
margin: 0;
padding: 0;
border: 0;
float: left;
background: #005500;
clear:both;}
Thanks for any effort you may be able to give!
Kelly
