Absolutely positioned elements and auto margins

[tropdars]

I'm building a website for a friend of mine and this is the first one I have entirely hand coded. Anyhow, my question has to do with centering. My site is a two column layout with the header, and nav stacked in the left column and the content floated up to the right to form my content column.

Being new to css I had hair pulling experience to get the floats to work which wasn't all that much fun so for the gallery section I added an extra navigation menu under the main nav using absolute positioning. My friend decided he wanted the whole thing centered so I used

 margin: 0 auto; 

on my wrapper div. this works perfectly on the floated elements but the absolutely positioned elements, being absolutely positioned, will break through the layout when the window is expanded. How can I somehow tie those absolutely positioned elements to my layout?

body{
padding:0px;
padding-top: 10px;
margin:0px;
}
#wrapper{
padding: 0px;
margin: 0px;
background-color: #000000;
width: 976px;
height: 581px;
border: solid 1px #000000;
margin: 0 auto;
}
#header{
padding: 0px;
margin: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #FFFFFF;
width: 250px;
height: 65px;
float: left;
}
#header img{
padding: 0px;
border: 0px;
margin-left: 0px;
}
#leftcolumn{
padding: 0px;
margin: 0px;
width: 250px;
height:580px;
background-color: #000000;
float: left;
}
#main_nav{
padding: 0px;
margin: 0px;
margin-left: 0px;
height:516px;
width: 250px;
background-color:#FFFFFF;
float:left;
}
#main_nav ul{
margin: 0px;
padding: 0px;
width:250px;
font-family: Arial, Helvetica, sans-serif;
list-style-type: none;
font-size: 16pt;
margin-top: 0px;
margin-left: 10px;
margin-right: 10px;
background-color: #FFFFFF;
float:left;
}
#main_nav a:link, a:visited{
color:#000000;
text-decoration: none;
border-bottom: 1px #000000;
}
#main_nav a:hover, a:active{
color:#000000;
border-bottom-style: solid;
}
li{
background-color: #FFFFFF;
margin-top: 10px;
margin-left:45px;
width: 150px;
height: 25px;
line-height: 2.5em;
font-size: 10pt;
text-align:right;
}
#thumbnav{
margin: 0px;
padding: 0px;
background-color: #FFFFFF;
position:absolute;
left:16px;
top:210px;
width: 240px;
border-top: 1px dotted;
}
#thumbnav ul{
margin: 0px;
padding: 0px;
background-color: #FFFFFF;
width: 240px;
height: 25px
}
#thumbnav li{
margin: 0px;
padding-left: 19px;
padding-right: 19px;
width: 40px;
list-style: none;
float:left;
display: inline;
font-family: Arial, Helvetica, sans-serif;
font-size: 9pt;
}
#folio_1{
border:0px;
padding:0px;
width:40px;
position: absolute;
top: 260px;
left: 38px;
}
#folio_2{
border:0px;
padding:0px;
width:40px;
position: absolute;
top: 260px;
left: 115px;
}
#folio_3{
border:0px;
padding:0px;
width:40px;
position: absolute;
top: 260px;
left: 194px;
}
#content{
padding: 0px;
margin: 0px;
margin-top: 0px;
background-color: #FFFFFF;
width: 726px;
height: 581px;
float: left;
}
#image_holder{
background-color: #FFFFFF;
padding:0px;
margin:0px;
margin-top: 30px;
}
#content img{
margin-right:auto;
margin-left:auto;
padding:0px;
}
#footer{
padding: 0px;
padding-left: 10px;
margin: 0 auto;
float: left;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}

[Marshall]

tropdars, welcome to WebmasterWorld.

Remove the margin: 0px; from your wrapper.

Marshall