Problema al tratar de centrar contenido en una web ancha

[SeaPirates]

Hola, no es la primera vez que me ocurre y nunca he podido resolverlo..

Estoy tratando de hacer un diseño web que ocupe el 100% de la pantalla, pero que el contenido esté centrado en un div de 985px de ancho y con position: absolute.

Me funciona bien con las secciones que le defino un "height", pero para el contenido donde van los artículos, menú lateral y demás no puedo definir una altura y se pone el contenido encima del footer..

Para que podáis verlo:
http://lacajatv.es/NUEVAWEB/

Podréis ver que el menú lateral se pone por encima. Traté de solucionarlo con overflow:hidden, pero no funciona.

¿Alguna solución?

Código CSS:

#clearfix {
    width: 985px;
    left: 50%;
    margin-left: -492.5;
    position: absolute;
}
 
#container {
    background: #FFFFFF;
    height: 100%;
    overflow: hidden;
    border-bottom: 1px solid #FFFFFF;
    border-bottom:1px solid #FFFFFF;
    -webkit-box-shadow:inset 0px -1px 0 #e5e5e5;
    -moz-box-shadow:inset 0px -1px 0 #e5e5e5;
    box-shadow:inset 0px -1px 0 #e5e5e5;
 
}
 
#column_01 {
    margin-top: 20px;
    width: 660px;
    float: left;
}
 
#column_02 {
    margin-top: 20px;
    margin-left: 25px;
    width: 300px;
    float: left;
}
 
#status {
    background: #f5f5f5;
    -moz-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
    height: 100px;
}
 
#footer {
    height: 100px;
}
 

[web2013]

Te aconsejo utilizar cuando trabajes con anchos al 100% o simplemente quieres centrar un contenido en la pantalla:

Código HTML:

<div style="margin:0px auto 0px auto">Aqui contenido</div>