CSS - Center Content Help Required

HI hope someone can help me with this its been driving me mad for a couple of days now.

Have desiged a site with css layout but I want to center it in a page so when I resize the browser window it will stay in the middle of the page. I know its a bit long winded but I would greatly appreciate the help.

I've used the css sheet and html bellow

Thanks




---------------------------css---------------------------------

body
{
text-align: center;
background-color:#000000;
}

#container
{
margin-left: auto;
margin-right: auto;
width: 65em;
text-align: left;
}



#pageContent {
height: 100px;
width: 100%;
background-color:#000000;
border:solid #000000 thin;

}


/*Headings*/

h1{

}

h2{
font-size:16px;
font-weight: bold;
color:#ff0000;
padding-left: 0em;

}

h3{

}


/*Div id's*/


/* --------------------------------------------------title------------------------------------------------------- */

#title {
position:absolute;
width: 429px;
height: 162px;
left: 194px;
top: 25px;
z-index:1;
}

/* --------------------------------------------------titleImage------------------------------------------------------- */

#titleImage {
position:absolute;
width: 358px;
height:180px;
left: 670px;
top: 7px;
z-index:2;

}

/* --------------------------------------------------navLeft------------------------------------------------------ */


#navLeftContainer {
position:absolute;
top: 188px;
left: 194px;
width: 154px;
height: 405px;
background-color:#ffffff;
z-index:3;

}

#navLeft {
position:absolute;
top: 2px;
left: 3px;
width: 145px;
height: 395px;
background-color:#FFFFFF;
border: solid #cccccc 2px;
overflow:auto;

}

/*
#navLeft ul {
list-style:none;
padding-top: 0em;
padding-left: 0em;
}

#navLeft li {
padding-bottom: .2em;

}


#navLeft a {
text-decoration:none;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color:#999999;
font-weight:800;


}


#navLeft a:hover {
color:#ff0000;


}


/* --------------------------------------------------navTop------------------------------------------------------ */

#navTop {
position:absolute;
top: 188px;
left: 346px;
width: 670px;
height: 24px;
background-color:#000000;
font-family: Arial, Helvetica, sans-serif;
border: solid #ff0000 2px;
overflow:hidden;
z-index: 4;

}

#navcontainer
{

padding: 0;
height: 22px;
}

#navcontainer ul
{
border: 0;
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

#navcontainer ul li
{
display: block;
float: left;
text-align: center;
padding: 0;
margin: 0;
}

#navcontainer ul li a
{
background: #000000;
width: 223px;
height: 24px;
border-top: 0px solid #000000;
border-left: 0px solid #000000;
border-bottom: 0px solid #000000;
border-right: px solid #000000;
padding: 0;
margin: 0 0 10px 0;
color: #ffffff;
text-decoration: none;
display: block;
text-align: center;
font: normal 16px/18px Arial, Helvetica, "Lucida Sans Unicode", verdana, lucida, sans-serif;
}

#navcontainer ul li a:hover
{
color: #ffffff;
background: #ff0000;
}

#navcontainer a:active
{
background: #c60;
color: #fff;
}

#navcontainer li#active a
{
background: #c60;
border: 1px solid #c60;
color: #fff;
}



/* --------------------------------------------------navBargains-------------------------------------------------- */

#navBargainsContainer {
position:absolute;
top: 594px;
left: 194px;
width: 154px;
height: 158px;
background-color:#ffffff;
z-index:5;
}


#navBargains {
position:absolute;
top: 0px;
left:2px;
width: 146px;
height: 150px;
background-color:#000000;
font-family: Arial, Helvetica, sans-serif;
border: solid #ff0000 2px;
overflow:auto;
padding-left: 0px;
color: ff0000;

}



/* -----------------------------------------------------contents---------------------------------------------------- */

#contents {
position: absolute;
left: 348px;
top: 217px;
width: 672px;
height: 535px;
background-color: #FFFFFF;
overflow:auto;
z-index:6;

}

#triangle {
position: absolute;
right: 0px;
bottom: 0px;
z-index:7;


}




/* -----------------------------------------------------html------------------------------------------------------*/




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "(URL address blocked: See forum rules)">
<html xmlns="(URL address blocked: See forum rules)">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="main.css" rel="stylesheet" type="text/css" />
</head>

<body>


<div id="container">



<!-- ****************************************************title******************************************* **** -->

<div id="title">
<img src="test/images/Dark-Logo.jpg" />
</div>

<!-- ****************************************************titleImage************************************** ********* -->
<div id="titleImage"> <img src="test/images/titleImage.jpg" width="353" height="180" /> </div>
<!-- ****************************************************navLeft***************************************** **** -->
<div id="navLeftContainer">
<div id="navLeft">
<h2>Menswear</h2>

<ul>
<li><a href="linked.htm">Jackets </a></li>
<li><a href="linked.htm">Jeans</a></li>
<li><a href="linked.htm">T-shirts</a></li>
<li><a href="linked.htm">Polos</a></li>
<li><a href="linked.htm">Jumpers</a></li>
<li><a href="linked.htm">Hodies & Sweats</a></li>
</ul>



<h2>Womenswear</h2>

<ul>
<li><a href="linked.htm">Going out Tops </a></li>
<li><a href="linked.htm">Day Tops</a></li>
<li><a href="linked.htm">Shirts & Blouses</a></li>
<li><a href="linked.htm">Jeans & Denim</a></li>
<li><a href="linked.htm">Knitwear</a></li>
<li><a href="linked.htm">Polos</a></li>
</ul>
</div>
</div>


<!-- ****************************************************navTop****************************************** **** -->

<div id="navTop">

<div id="navcontainer">
<ul id="navlist">
<li id="active">
<li><a href="#" id="current">Menswear</a></li>
<li><a href="#">Womenswear</a></li>
<li><a href="#">Junior</a></li>
</ul>
</div>
</div>


<!-- ****************************************************navBargains************************************* **** -->

<div id="navBargainsContainer">
<div id="navBargains">
<h2>Items in Focus</h2>
<ul>
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
</ul>
</div>
</div>

<!-- ****************************************************contents**************************************** ***** -->


<div id="contents">



<div id="triangle">
<img src="test/images/triangle.gif" width="55" height="55" />
</div>


</div>

</div>




</body>
</html>





/* Links End */