CSS - Browser Size & Alignment Problem

<style type="text/css">
body
{
	background-image:url('bg-1.jpg');
	background-repeat:no-repeat;
	background-position:top;
	background-color:#FFF;
	background-attachment:fixed;
}
* {
	margin: 0px;
	padding: 0px;
}
#wrapper {
	height: 1300px;
	width: 1000px;
	margin:0px auto;
	text-align:left;
}
#branding {
	height: 228px;
	width: 1000px;
}
#branding #logo {
	height: 228px;
	width: 1000px;
	position: relative;
	background-image:url('hooplogolarge.jpg');
	background-repeat:no-repeat;
	background-position:top;
	background-color:#000000;
}
#siteNav {
	height: 38px;
	width: 1000px;
	color: #FFF;
	background-color: #000;
	line-height: 38px;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	float: none;
	text-align: center;
	word-spacing: normal;
	font-size: 24px;
}
#mainContentWrapper {
	float: none;
	width: 1000px;
	background-color: #FFF;
}
#mainContentWrapper #news {
	float: left;
	width: 265px;
	height: 953px;
	background-color:#FFF;
	border: thin dashed #000;
	padding: 10px;
}
#mainContentWrapper #mainContent {
	float: left;
	width: 488px;
	height: 953px;
	background-color:#FFF;
	padding: 10px;
	border: thin dashed #000;
}
#mainContentWrapper #siteAds {
	float: right;
	width: 175px;
	height: 953px;
	background-color:#FFF;
	padding: 10px;
	border: thin dashed #000;
}
#footer {
	width: 1000px;
	font-size: 9px;
	color: #CCC;
	text-align: center;
	line-height: 35px;
	background-color: #000;
	clear: both;
}
</style>

style :: [ ] [ ]

style ::
[ ] [ ]

<div id="style_selector">
    <p>style ::&nbsp;
        <a href="#" onclick="setActiveStyleSheet('SE001');
        return false;" title="change to style: Underwater - Water Planet"><div id="style_se001">Blue</div></a>
        <a href="#" onclick="setActiveStyleSheet('SE002');
        return false;" title="change to style: Orkidea - Beautiful"><div id="style_se002">Orange</div></a>
    </p>
</div>

#style_selector{
	position: absolute;
	top: 70px;
	left: 160px;
	height: 25px;
	width: 100%;
	text-align: left;
}
#style_se001{
	float: left;
	height: 15px;
	width: 15px;
	text-indent: 10000px;
	overflow: hidden;
	background-color: #6187E1;
	display: block;
	border: 1px solid #ffffff;
}
#style_se001:hover{
	border: 1px solid #6187E1;
}
#style_se002{
	float: left;
	height: 15px;
	width: 15px;
	text-indent: 10000px;
	overflow: hidden;
	background-color: #FCB029;
	display: block;
	border: 1px solid #ffffff;
}
#style_se002:hover{
	border: 1px solid #FCB029;
}

<style type="text/css">
.formInput:after, .formInput .formField:after{
clear:both;display:block;visibility:hidden;height:0;content:'.'}
.formField {float:left;width:40%;}
.formInput{position:relative;}
.formInput div.ex{position:static;left:24%; width:5em}
.formLabel {float:left;width:25%;text-align:right;}
</style>

<div style="width:700px">
<form>          
<div id="cityFld" class="formInput">
	<div class="formLabel"><label for="city">City</label></div>
	<div class="formField">
		<input type="text" name="city" id="city" value="">
		<div class="ex">city explanation</div>
	</div>
</div>


<div id="zipFld" class="formInput">
	<div class="formLabel"><label for="city">Zipcode</label></div>
	<div class="formField">
		<input type="text" name="zip" id="zip" value="">
		<div class="ex">zip explanation</div>
	</div>
</div>
</form>
</div>

html {height:100%;}

body{

margin:0; padding:0; height:100%;
font-family:Times New Roman, serif;
background-color:white;
}


#wrap{

background-image:url(bgimage.jpg);
background-position:top left;
background-repeat:repeat-y;
min-height:100%;
width:790px;
margin:auto;
}


* html #wrap {height:100%}

#header{

background-image:url('keyboard.jpg');
background-position:left;
background-repeat:no-repeat;
background-color: #FEFEFE;
margin:0; padding:0;
height:117px;
width:615px;
border-left: 1px solid #777777; 
float:left; 
}


p{

margin:0px; padding:0;
font-family: courier;
}


p.headline{

margin:0px; padding-left:5px;
font-family: arial;
font-weight:bold;
font-size:70%;
}


p.news{

margin:0px; padding-left:5px;
font-family: arial;
font-size:70%;
color:#808080;
}


h1{

position:relative;
line-height:0px;
margin:0; padding-left:10px;
font-size:115%;
color:#1B018E;
}


#left{

float:left;
width:200px;
text-align:left;
background-color:#FFFFFF;
border-left: 1px solid #777777; 
border-right: 1px solid #777777; 
}


#main{

float:right;
clear:both;
text-align:left;  
width:565px;
border-right: 1px solid #777777;
}


#clearfooter{

clear:both;
height:30px;
overflow:hidden;
}


#footer{

height:30px;
background-color: #777777;
margin:0 auto; padding:0;
margin-top:-30px;
color:#FFFFFF;
text-align:center;
width:790px;
}


#bannercell{

float:right;
clear:both;
background-color:white;
text-align:right;
width:175px;
height:117px;
font-size:75%;
margin:0; padding:0;
border-right: 1px solid #777777;
}


#borderleft{

border-left: 1px solid #777777; 
}


#topright{

float:right;
clear:both;
background-color:white;
text-align:right;
width:175px;
height:53px;
font-size:75%;
margin:0; padding:0;
border-right: 1px solid #777777;
}


input.box{

height:17px;
}


#linkbanner{

width:615px;
height:19px;
float:left; 
text-align:left;
border-left: 1px solid #777777; 
background-color: #777777;
}


#grayfade{

float:right;
clear:both;
border-right: 1px solid #777777;
background-image:url(gray_grad.jpg);
width:175px;
height:16px;
}


#space{

border-right: 1px solid #777777;
border-left: 1px solid #777777; 
background-color: #FFFFFF;
height:25px;
width:790px;
}


#extraspace{

float:right;
clear:both;
border-right: 1px solid #777777; 
background-color: #FFFFFF;
height:25px;
width:565px;
}


#newsbar{

background-image:url(blue_grad.jpg);
background-repeat:no-repeat;
width:200px;
height:10px;
}


#mainbar{

background-image:url(blue_lg.jpg);
background-repeat:no-repeat;
width:565px;
height:10px;
border-right: 1px solid #777777;
}


#mainbarsm{

float:right;
clear:both;  
width:565px;
background-image:url(blue_thin.jpg);
background-repeat:no-repeat;
height:5px;
}


#heading{

background-color: #FFFFFF;
margin:0; padding:0;
height:53px;
width:615px;
border-left: 1px solid #777777; 
float:left; 
text-align:left;
}

<center>
<body background="../images/bg_texture2.gif">
<div id="wrap">

<div id="heading"><img src="../images/logo.gif"><font face="Bodoni MT" size="5" color="#040C89">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Company Name</font></div>

<div id="topright"><font color="#6666FF">Monday April 4, 2005</font></div>

<div id="header"></div>

<div id="bannercell"><center>.::Client Login::.</center>
<br>
<font size="2">username&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" size="13" class="box">
password&nbsp;&nbsp;&nbsp;&nbsp;<input type="password" size="13" class="box"></font>
<center><input type="submit" value="Login"></center></div>

<div id="linkbanner"><font color="#FFFFFF" size="2">About Us&nbsp;&nbsp;|&nbsp;&nbsp;Services&nbsp;&nbsp;|&nbsp;&nbsp;Solutions&nbsp;&nbsp;|&nbsp;&nbsp;Help Desk&nbsp;&nbsp;|&nbsp;&nbsp;Training&nbsp;&nbsp;|&nbsp;&nbsp;Careers&nbsp;&nbsp;|&nbsp;&nbsp;Contact</font></div>
<div id="grayfade">&nbsp;</div>

<div id="space">&nbsp;</div>

<div id="left">

<div id="newsbar"><h1>Recent News</h1></div>

<p class="headline">.::New Website::.</p>
<p class="news">We're launching a new website in the near future.  Look for great things to come!</p><br>
<p class="headline">.::Done using CSS::.</p>
<p class="news">No tables with this design.  "Out with the old and in with the new."</p><br>
<p class="headline">.::Continuously Changing::.</p>
<p class="news">With us having recent news on the website, the main page will be changing all
the time with the latest info about Us and stuff</p><br>
<p class ="headline">.::Sales Platform::.</p>
<p class="news">We can also use this as an area for sales opportunities and promotion.  It will
be a good reference for all new products and features from Us.</p>
</div>

<div id="main">

<div id="mainbar"><h1>Your Cool Slogan</h1></div>
<br>

<p class="news"><strong>Intuitive.</strong>  Having the knowledge and experience in a changing <img src="../images/imis.gif" align="right" border="0"> world to make expert decisions through perceptive insight.  We allow your organization to tear down barriers by offering <strong>software solutions, innovative design, and managed services.</strong>
Specializing in <i>sutff</i> and ore stuff</i> software we are able to expand the dimensions of your organization, and provide you with the solutions needed for an on demand world.
</p>

<div id="mainbarsm"></div>

<p class="news">Having the knowledge and experience in a changing <img src="../images/microsoft.gif" align="right" border="0"> world to make expert decisions through perceptive insight.  We allow your organization to tear down barriers by offering software solutions, innovative design, and managed services.
</p>
</div>

<div id="extraspace"></div>

<div id="clearfooter"></div>

<div id="footer">
<center><font size="2">2005 Us. All rights reserved.<br>
Site produced by a Web Guy, Content Manager.</font></center>
</div>

</body>
</center>