• Locked
No replies
Wed, 2011-09-14 14:30
ukinmac74
ukinmac74's picture
Offline
newbie
Los Angeles
Last seen: 11 years 37 weeks ago
Los Angeles
Timezone: GMT-7
Joined: 2011-09-14
Posts: 1
Points: 2

I'm having a hard time figuring out why my home text link is so far off to the right. I know my spacing is set to 160, but if you measure it. It has an additional 40px space before it. I would like the home button to start closer to the left hand side.

Please any help would be greatly appreciated.

This is the html and below is the style sheet

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<title>Easy Living by Lisa Marie- Professional Organization and Design</title>
 
		<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
</head>
	<body>
	<div id="wrapper">
		<div id="content">
			<div id="header">
				<img src="images/logo.jpg" alt="easy living by lisa marie- organizing your life so you can enjoy it" width="554" height="197" />
 
				<ul id="nav">
					<li id="home"><a href="index.html">Home</a></li>
					<li id="lisa"><a href="about.html">About Lisa Marie</a></li>
					<li id="services"><a href="services.html">Services</a></li>
					<li id="benefits"><a href="benefits.html">Benefits</a></li>
					<li id="testimonials"><a href="testimonials.html">Testimonials</a></li>
					<li id="contact"><a href="contact.php">Contact</a></li>
				</ul><!--end of nav-->
 
			</div><!--end of header-->
 
			<div id="slideshow">
				<img src="images/slide1.jpg" alt="" class="active" />
				<img src="images/slide2.jpg" alt="" />
				<img src="images/slide3.jpg" alt="" />
				<img src="images/slide4.jpg" alt="" />
				<img src="images/slide5.jpg" alt="" />
				<img src="images/slide6.jpg" alt="" />
			</div><!--end of slideshow-->
	</div><!--end of content-->
	</div><!--end of wrapper-->
	</body>
 
</html>

Here is the style sheet:

body {
	background-image: url(../images/background.jpg);
	margin: auto;
	}
 
#wrapper {
	width: 1054px;
	background-color: #ffffff;
	color: #000000;
	border: 1px white;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	margin-bottom: 30px;
	padding-bottom: 20px;	
	}
 
h1 {
	font-family:"Apple Chancery", Serif;
	font-weight: normal;
	font-size: 32px;
	text-align: left;
	color: #60b6d7;
	}
 
h2 {
	font-family:"Apple Chancery", Serif;
	font-weight: normal;
	font-size: 26px;
	text-align: center;
	color: white;
	}
 
h3 {
	font-family:"Apple Chancery", Serif;
	font-weight: normal;
	font-size: 28px;
	text-align: left;
	color: #60b6d7;
	}
 
h4 {
	font-family:"Apple Chancery", Serif;
	font-weight: normal;
	font-size: 20px;
	text-align: left;
	color: #000000;
	}	
 
#header {
	text-align: center;
	}
 
#nav {
	height: 50px;
	width: 960px;
	background-color: #60b6d7;
	margin: auto;
	list-style: none;
	display: block;
	overflow: hidden;
}
 
#nav li {
	margin-top: 10px;
	float: left;
	width: 160px;
	}
 
#nav li a:link {
	color: white;
	font-family: "Apple Chancery", Serif;
	font-size: 25px;
	text-decoration: none;
	height: 50px;
}
 
#nav li a:hover {
	color: black;
	font-family: "Apple Chancery", Serif;
	font-size: 25px;
	text-decoration: none;	
	height: 50px;
}
 
#nav li a:visited {
	color: black;
	font-family: "Apple Chancery", Serif;
	font-size: 25px;
	height: 50px;
}

Top
Tags: