My images wont load when I preview in any browser

mitalejo · 07-01-2010, 07:46 AM

I am working on a site and when I go to preview in any browser none of my images load. I am really new to this but made a website that worked yesterday now when I try to get a little more in-depth i dont really know what is going wrong.

Here is my css

Code:

 
@charset "UTF-8";

body {
	background: 727ba0;
	background-image: url(../image/background.png) repeat-x left top;
	text-align:center;
	font-family:"goudy old style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
}

#wrap {
	width: 948px;
	background-image:url(image/Wrap.png) repeat-y left top;
	margin: 0 auto;
	text-align: left;
}

#content {
	background-image:url(image/container.png) no-repeat left top;
}

h1 {
	width:470px;
	margin: none;
	float:left;
	height:150px;
}

h1 a {
	width:470px;
	height:150px;
	display:block;
	background-image:url(image/logo.png) no-repeat top left;
}

h1 a span {display: none;}

/* top navigation menue */

#main-navigation {
	float: right;
	height:49px;
}

#main-navigation li {
	float:left;
	height:49px;
	margin:none;
	position:relative;
	padding-top:1px;
}

#main-navigation li a {
	height:49px;
	display:block;
}

#main-navigation li a span {
	display:block;
	height:49px;
	text-indent:-9999px;
	line-height:0;
	font-size:0px;
}

#main-navigation #nav-home {
	background-image:url(image/nav-home.png) no-repeat left top;
	width:99px;
	margin:none; /*as needed to look good*/
}

#main-navigation #nav-home span {
	background-image:url(image/nav-home.png) no-repeat left bottom;
	width:99px;
}

#main-navigation #nav-about-us {
	background-image:url(image/nav-about-us.png) no-repeat left top;
	width:134px;
	margin:none; /*as needed to look good*/
}

#main-navigation #nav-about-us span {
	background-image:url(image/nav-contact.png) no-repeat left bottom;
	width:134px;
}

#main-navigation #nav-contact {
	background-image:url(image/nav-contact.png) no-repeat left top;
	width:123px;
	margin:none; /*as needed to look good*/
}

#main-navigation #nav-contact span {
	background-image:url(image/nav-contact.png) no-repeat left bottom;
	width:123px;
}

#main-navigation #nav-retailers {
	background-image:url(image/nav-retailers.png) no-repeat left top;
	width:123px;
	margin:none; /*as needed to look good*/
}

#main-navigation #nav-retailers span {
	background-image:url(image/nav-retailers.png) no-repeat left bottom;
	width:123px;
}

#main-navigation .current {background-position: left center}
#main-navigation li a.current span {diplay:none;}

and here is the html

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>mack &amp; bancker | fine jewelry</title>
<link href="style.css" rel="stylesheet" type="text/css"/>
</head>
 
<body>

	<div id="wrap">
    <div id="content">
    	<h1>
        	<a href="#" title="welcome to mack &amp; bacnker">
            <span>Fine Jewelry | Engineered Works of Art</span>
            </a>
        </h1>
        <ul id="main-navigation">
        <li>
        	<a id="nav-home" class="current" href="index.html" title="mack &amp; bancker">
        	<span>Home</span>
        	</a>
        </li>
        <li>
        	<a id="nav-about-us" href="#" title="about us">
        	<span>About Us</span>
        	</a>
        </li>
        <li>
        	<a id="nav-contact" href="#" title="about us">
        	<span>Contact</span>
        	</a>
        </li>
        <li>
        	<a id="nav-retailers" href="#" title="retailers">
        	<span>Retailers</span>
        	</a>
        </li>
        </ul>
	</div>
    </div>
    
</body>

All the images are in the same folder under "image" and all names are spelled correctly. Why wouldn't the images be loading or linking or anything of the sorts???

Any help would be great thanks.

_mitch

JJackson · 07-01-2010, 08:02 AM

According to W3C, your markup and CSS is invalid. Here are two links that will help you out:

XHTML Validation
CSS Validation

mitalejo · 07-01-2010, 09:34 AM

Thank you that solved a good deal of my problems.

JJackson · 07-01-2010, 08:53 PM

No problem. Glad I could help!