I am redesigning one of my sites, I have spent alot of time trying to get the second tier (li ul li) to space horizontally properly like the first tier. I cannot see what I am doing wrong. on another question, is the width of my working space too wide, (1000 px). Thanks for any feedback. The code follows...

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>New Site</title>

<style type="text/css">

html,body {

	padding:0;
	
	margin:0;

}

.wrapper {
	
	position:relative;

	margin-left: auto;
	
	margin-right: auto;
	
	width:1000px;
	
	height: 100%;	
	
}

.logo {

	position:absolute;

	top:0;

	left:0;
}

.nav {
	
	width:100%; 

	height:30px; 

	background-color:#0A3881;

	position:fixed;
	
	margin-left: auto;
	
	margin-right: auto;

	left:0px;

	top:0px;
	
	}

.nav1 {

	position: relative;
	
	color: white;
	
	margin: 0px auto;
	
	width: 1000px;
	
	line-height: 2em;
	
}

.nav1 ul {

	margin: 0;
	
	padding: 0;
	
	list-style: none;
		
}

.nav1 ul li{

	padding-left: 10px;
	
	padding-right: 10px;
	
	display: inline;
	
	font-family: Arial, Helvetica, sans-serif;
	
	font-size: 14px;
	
	border-right:2px orange solid;
}

.nav1 li ul {

	position:absolute;
	
	top:45px;
	
	left:225px;
	
	display: inline;
	
	padding-right:15px;
}

.nav1 li ul li {

	position:relative;
	
	width:100px;
	
	height:150px;
	
	background-color:green;
	
}

.about {
	float: right;
}

.about ul {

	margin: 0;
	
	padding: 0;
	
	float:right;	

}

.about ul li {

	display: inline;
	
	list-style: none;
	
	font-family:Arial, Helvetica, sans-serif;
	
	font-size:14px;
	
	padding-left:15px;
	
}

.nav2 li ul {

}

</style>
</head>

<body style="padding:0px;">
<div class="nav"><div class="nav1">
<ul>
<li>
Button 1<ul>
<li>
Tier 2 - 1
</li>
</ul>
</li>
<li>
Button 2
<ul>
<li>
Tier 2 - 2
</li>
</ul>
<li>
Button 3
<ul>
<li>
Tier 2 - 3
</li>
</ul>
<li>
Button 4
<ul>
<li>
Tier 2 - 4
</li>
</ul>
<li>
Button 5
<ul>
<li>
Tier 2 - 5
</li>
</ul>
<li>
Button 6
<ul>
<li>
Tier 2 - 6
</li>
</ul>
<li>
Button 7
<ul>
<li>
Tier 2 - 7
</li>
</ul>
<li>
Button 8
<ul>
<li>
Tier 2 - 8
</li>
</ul>
</li>
</ul>
</div>
<div class="wrapper">
<div class="logo">
	<img alt="" height="168" src="images/SomeLogo.png" width="218" /></div>
<div class="about">
<ul>
<li>
Contact Us
</li>
<li>
About Us
</li>
</ul>
</div>
<div class="nav2">

</div>
</div>
</div>
</body>

</html>