1 reply [Last post]
bluetech
bluetech's picture
Offline
newbie
Last seen: 5 years 46 weeks ago
Timezone: GMT-6
Joined: 2013-03-30
Posts: 2
Points: 4

Hello. I am starting a site in EW4, and the header is positioned as i want it in the design mode, when I view it in a browser, it is centered. I need it to be left, and have tried changing the css every way I could. Thanks in advance. Dave

<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link rel="stylesheet" type="text/css" href="main.css" />
<style type="text/css">
</style>
</head>
 
<body style="background-color: #666666">
 
<div id="container">
	<div id="header">
		<img alt="" height="175" src="images/banner_13_2.jpg" width="900" /></div>
</div>
<div id="menu">
	</div>
<div id="content">
</div>
<div id="footer"> 
	<em>Fish hard...fish with the best!</em><br />
	Hindsight Sortfishing<br />
	Fishing out of Rock Harbor, Orleans, Cape Cod, MA<br />
	<br />
	<span class="auto-style3">&copy; Hindsight Sportfishing 2013</span><br />
    <span class="auto-style3">Site desesign and SEO by</span>
		<a href="http://www.offshorepursuits.com">Offshore Pursuits LLC</a><br />
	<span class="auto-style3">Site Map</span><br />
</div>
 
</body>
 
</html>

.auto-style2 {
	font-size: x-small;
	color: #C0C0C0;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
}
.auto-style3 {
	font-size: x-small;
	color: #C0C0C0;
}
#container {
	padding: 0px;
	margin: 0px auto 0px auto;
	width: 900px;
	height: 100%;
}
#header {
	background-repeat: no-repeat;
	padding: 0px;
	margin: 0px;
	width: 900px;
	height: 175px;
	background-color: #666666;
	clear: none;
	margin-left: auto;
	margin-right: auto;
}
#footer {
	padding: 0px;
	margin: 0px;
	width: 900px;
	height: 125px;
	clear: both;
	background-color: #666666;
	text-align: center;
	color: #FFFFFF;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: small;
	font-weight: bold;
}
.menu {
	float: left;
	width: 150px;
	background-color: #666666;
	bottom: ;
}
#menu {
	float: left;
	width: 150px;
	background-color: #666666;
	bottom: ;
}
 
 
#content {
	width: 680px;
	float: right;
	padding-bottom: 0;
	padding-left: 10px;
	padding-right: 35px;
	background-color: #666666;
	color: #FFFFFF;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: small;
}
#body {
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	color: #FFFFFF;
}.auto-style1 {
	font-size: small;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-style: italic;
}
.h1 {
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: medium;
	font-weight: bold;
	color: #FFFFFF;
}
.content a:link, a:visited, a:actve {
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-weight: bold;
	color: #FFFFFF;
}
.content a:hover {
	font-weight: bold;
	color: #800000;
}.footer a:hover {
	font-weight: bold;
	color: #800000;
 
}
.footer a:link, a:visited, a:active {
	font-weight: bold;
	text-decoration: underline;
	color: #FFFFFF;
}
.footersmall {
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: x-small;
	color: #C0C0C0;
}

//mod edit: When posting source code, use the 'code' button above the entry area, or wrap it in bbcode tags, [code] [/code]. Fixed. ~gt

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 39 weeks 21 hours ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

But, you centered its parent,

But, you centered its parent, #container, and #header is the same width. Delete margin from #container and you should have what you want.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.