http://berryequipment.net/berry3/
Basically, the best thing I can say is that it works and is positioned the way it should be, in Firefox however it isn’t in internet explorer. Only code I left out was the nav’s hover effects.
css
html {
min-width:999px;
}
body {
color: #2b2b2b;
font-family: arial;
min-width:999px;
margin: 0px;
padding: 0px;
background: #f1f1f1;
}
img {
border: 0px;
}
ul, li {
list-style-type: none;
display: inline;
}
a, a:visited {
text-decoration: none;
color: #444;
}
a:hover {
text-decoration: underline;
color: #000;
}
a:focus, a:hover, a:active { outline:none }
#container {
background-image: url(http://berryequipment.net/berry3/images/layout/headerbg.jpg);
background-repeat: repeat-x;
text-align: center;
width: 100%;
}
#main_container {
position: relative;
text-align: center;
margin-left: auto;
margin-right: auto;
width: 950px;
}
#header {
text-align: left;
width: 950px;
height: 118px;
background-image: url(http://berryequipment.net/berry3/images/layout/topbg.jpg);
}
#logo {
float: left;
width: 285px;
height: 106px;
background-image: url(http://berryequipment.net/berry3/images/layout/logo.jpg);
}
#main_nav {
padding-bottom: 10px;
position: absolute; bottom: 0px; left: 321px;
text-transform:uppercase;
font-family: helvetica, arial;
font-size: 12px;
text-align: left;
color: #FFF;
}
index
<?php
session_start();
header("Cache-control: private");
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<title></title>
<link href="styles/main.css" rel="stylesheet" type="text/css" title="default">
</head>
<body>
<div id="container">
<div id="main_container">
<div id="header">
<div id="logo"></div>
<div id="main_nav">
<ul>
<li><a href="#">Engineering</a></li>
<li><a href="#">Fabrication</a></li>
<li><a href="#">Parts</a></li>
<li><a href="#">Service</a></li>
<li class="selected">Equipment</li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div id="account_nav">
my account<br />
videos<br />
technical manuals<br />
shopping cart (0)<br />
logout
</div>
</div>
<div id="body">
test
</div>
</div>
</div>
</body>
</html>