Problema CSS desarrollo Web

Hola amigos, ya no doy más por eso recurro a uds. a ver si alguien sabe y me puede ayudar... Por mas que he craneado y craneado, y buscando tutorial por tutorial no puedo lograr lo que quiero...

La cosa es que estoy empezando a hacerme una paginita pero tengo un problema de mierda con el footer... Quiero que el footer este al final de la página y con un ancho que sea igual al de la pantalla...sea cual sea la resolución de la pantalla, osea que sea líquido... Y cuando se achique la pantalla, el footer también lo haga hasta cierta medida. Practicamente lo he logrado, pero acá salta una falla de mierda...dentro del footer tengo dos divs, sin embargo al achicar el ancho del explorador, el footer se achica hasta que los dos divs se juntan, y si sigo achicando el explorador el div que está a la derecha (dentro del Footer), se sale del footer y pasa para abajo, queda fuera del footer bajo el div isquierdo, dejándome un espacio bajo el footer, wea horrible.

He tratado muchas cosas, html body height 100%, lo puse en auto y el body se adapta a la resolucion de la pantalla...etc.. en footer está en posición absoluta...
En el fondo esta todo como quiero excepto esa falla que da al achicar el explorador...

Acá les dejo la url para que pruebe el problema al achicar el ancho del explorador:

http://parentesis.host22.com/360

Espero puedan ayudarme...de todos modos les agradezco el solo hecho de leerme...
Eso, Saludos...

 

Gracias por responderme perrito...mira los estilos:

.body {
bottom: 0px;
padding: 0 px;
background-image: url(../images/bg.png);
background-repeat: repeat;
margin: auto;
padding: 0;
width: 100%;
height: 100%;
}



}




html, body {
margin:0px;
height: auto;
width: auto;
padding: 0px;
}




* html body{
height:100%;
}


#fb{
width: 32px;
height: 32px;
margin-top: 10px;
margin-left: 3px;
}


#tw{
width: 32px;
height: 32px;
margin-top: 5px;
margin-left: 3px;
}
#footer{
position: absolute;
width: 100%;
height: 150px;
bottom: 0 !importante;
background-repeat: repeat;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #333333;
background-image: url(../images/bgFooter.png);
bottom:0px;
}
#wrapFooterDer {
float: left;
height: 150px;
width: 600px;
margin-right: 25px;
}


#botonera{
float:left;
width: 242px;
height: 338px;
}




#fb-root{
float: left;
width: 400px;
height: 50px;
margin-left: 50px;
margin-top: 30px;
}


#footer1{
width: 300px;
height: 100px;
float: right;
border-right-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #494949;
border-left-color: #494949;
margin-top: 22px;
position: relative;
}
.txtFooter {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #666;
display: block;
text-align: justify;
width: 250px;
margin-top: 15px;
margin-left: 15px;
}
#footer2{
width: 300px;
height: 100px;
float: left;
margin-top: 22px;
}


#foterIsq{
width: 450px;
height: 150px;
float: left;
}
si po si probe y siempre se me sale del footer el contenido al achicar el ancho de la pagina... Saludos

 

Gracias steeep, voy a probar lo que me dices, siempre se aprende algo, no tenia claro eso de fixed y fluid, muy interesante, vale perrito...y sipo, cuando me resultara bien lo del footer hiva a poner otra caja más, saludos compa...

 

puta no me saleee...gracias de todas maneras