I have a page but it stretches across the screen vertically and horizontally and therefore there are 2 scrollbars. However the entire page is on the left hand side and there is no need for the extra space to the right of it or below it.
I have aligned it to the center but i cant understand why all this extra space appears.
Im sure its something im missing in my code.
Here is the style sheet
Code:
@charset "utf-8";
body {
margin:0px auto;
padding:0px;
text-align: center;
background: #96B4CE;
}
* {
margin: 0;
padding: 0;
border: 0;
}
#wrap {
background:#96B4CE url(images/bg2.jpg) no-repeat;
background-position: top;
background-position: center;
text-align:center;
width: 1018px;
height:1106px;
margin: 0 auto;
padding: 0;
}
#top {
position:relative;
left:305px;
top:6px;
clear: both;
}
#nav {
margin: 0px auto 0;
position:relative;
clear: both;
top: -4px;
}
#welcome {
margin: 0px auto 0;
position:relative;
clear: both;
top: -4px;
left: 4px;
}
#main {
margin: 0px auto 0;
position:relative;
float:left;
left:160px;
top:-120px;
clear: both;
}
#search {
left:270px;
top:-156px;
z-index:2;
display: inline;
position:relative;
clear: both;
}
#Haves {
position:relative;
left:-57px;
top:-50px;
z-index:2;
clear: both;
}
#Wants {
position:relative;
left:68px;
top:-80px;
z-index:2;
clear: both;
}
#banner {
position:relative;
left:219px;
top:-200px;
clear: both;
}
#footer {
position:relative;
left:152px;
top:-120px;
clear: both;
}
.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}
here is the html page
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" />
</div>
<div id="welcome">
<img src="images/welcome-to-inafrenzy.jpg" alt="" 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 class="style2">Recently Added <br>Haves</p>
</div>
<div id="Wants" class="style3">
<p class="style3">Recently Added <br>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="bottom" /></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>
unfortunately i do not have access to my ftp right now so i cannot upload the pages.
i will be able to upload in a few hours if that will help to understand what is going on
thanks in advance