Hi
I cannot get the alignment to work in both IE and FF. It works in one and then not in the other.
Here is my code:
Code:
@charset "utf-8";
body {
margin:0px auto;
padding:0px;
text-align: center;
background: #96B4CE;
}
* {
margin: 0;
padding: 0;
border: none;
}
#wrap {
background:#96B4CE url(images/bg2.jpg) no-repeat;
background-position: top;
background-position: center;
width: 1024px;
height:1106px;
margin: 0 auto;
padding: 0;
z-index:1;
}
#top {
position:relative;
left:750px;
top:6px;
width:151px;
height:22px;
z-index:1;
}
#nav {
width: 715px;
height: 145px;
margin: 0px auto 0;
position:relative;
top: -14px;
}
#main {
width: 715px;
margin: 0px auto 0;
position:relative;
left:0px;
top:-105px;
}
#search {
left:270px;
top:-115px;
z-index:2;
width: 255px;
height: 30px;
display: inline;
position:relative
}
#Haves {
position:relative;
left:-58px;
top:-24px;
width:121px;
height:38px;
z-index:2;
}
#Wants {
position:relative;
left:70px;
top:-62px;
width:102px;
height:43px;
z-index:2;
}
#banner {
position:relative;
left:560px;
top:-130px;
width:344px;
height:71px;
z-index:1;
}
#footer {
position:relative;
left:7px;
top:-100px;
width:728px;
height:17px;
z-index:1;
}
.style1 {font-family: "Arial Rounded MT Bold"; font-size: x-small; color: #FFFFFF;}
.style2 {font-family: "Arial Rounded MT Bold"; font-size: small; color: #FFFFFF}
.style3 {font-family: "Arial Rounded MT Bold"; font-size: small; color: #999999}
.style4 {font-family: "Arial"; font-size: 11px; color: #747474}
Code:
<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Inafrenzy</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body><div id="wrap"><div class="style1" id="top">Join! | Sign In | Help</div>
<div id="nav">
<img src="images/navigation.png" alt="" align="texttop" />
<img src="images/welcome-to-inafrenzy.jpg" alt="" width="705" height="81" align="top" /></div>
<div id="banner">
<img src="images/banner.png" alt="" />
</div>
<div id="search">
<input name="textfield" type="text" id="textfield" value="" size="14" /> <img src="images/search.png" align="absmiddle">
</div>
<div id="Haves" class="style2">
<p> </p>
<p class="style2">Recently Added Haves</p>
</div>
<div id="Wants" class="style3">
<p> </p>
<p class="style3">Recently Added Wants</p>
</div>
<div id="main">
<table width="705" border="0" align="top">
<tr>
<td width= "31%"><p><img src="images/video.png" alt="" align="texttop" /></p>
<p> </p>
<p><img src="images/justjoined.png" alt="" align="texttop" width= "210"/></p>
<p><img src="images/newusers.png" alt="" align="texttop" width="210"/></p>
<p> </p>
<p><img src="images/mostpopular.png" alt="" align="texttop" width="210" /></p>
<p><img src="images/newusers.png" alt="" align="texttop" width="210"/></p>
<p> </p>
<p> </p></td>
<td width = "40%"><h1><em>
<label><img src="images/middlecontent.png" alt="" align="texttop" /><br />
<img src="images/donebarters.png" alt="" width="275" height="31" /><br />
<img src="images/donebarterscontent.png" alt="" width="275" height="288" /><br />
<br />
</label>
</em></h1>
<p></p></td>
<td width = "29%" valign="top"><p></p>
<img src="images/alerts.png" alt="" width="200" height="31" align="texttop" />
<p><img src="images/categories.png" alt="" /></p>
<p><img src="images/tags.png" alt="" width="191" height="30" /></p>
<p align="center"> <img src="images/tagwords.png" alt="" align="absmiddle" /></p>
<p><img src="images/stalkuseverywhere.png" alt="" width="191" height="24" /></p>
<p><img src="images/stalk.png" alt="" width="191" height="176" /></p>
<p> </p></td>
</tr>
</table>
</div>
<div id="footer" class="style4" align="left">
©2009 Inafrenzy.com. All rights reserved. About | Site Map | Blog | Terms & Conditions | Privacy Statement | Help</div></div></body></html>
Any ideas?
Thanks!
Add to del.icio.us 
Can you digg it?
Linear Mode
