No es que me moleste... es simplemente que podemos evitar ciertas cosas.
En fin...
Bueno entonces te propongo algo distinto, asi no queda como que solo enttré a renegar, lo cual no he hecho tampoco.
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Hombres Trabajando</title>
<style type="text/css">
body{
margin:0;
padding:0;
width:100%;
height:100%;
}
#container{
position:relative;
left:0;
top:0;
width:1000px;
min-height:600px;
overflow:hidden;
<!-- Aqui establecemos estas dos propiedades, que serán las que hagan crecer el div a medida que
haya más contenido.-->
padding-bottom:10px; <!---- para que se aleje tu texto un poco del final del container-->
}
*html #container{
height:600px;
overflow:visible;
}
<!--aqui usamos el hack del asterisco que consiste poner un asterisco y luego
html antes del nombre del elemento a distinguir en internet explorer le diremos que tenga una altura definida,
pero lo que se pase, si se verá y como el IE tiene un defecto, crecerá con el fondo del elemento contenedor.-->
<!--Pasemos a la estructura básica-->
#header{
position:relative;
left:0;
top:0;
width:100%;
height:100px; <!--- la cabecera no crecerá -->
overflow:hidden; <!-- además todo contenido que se pase no se verá-->
background:red;
}
#wrapper{
position:relative;
left:0;
top:0;
width:100%;
min-height:400px; <<!--la misma explicación sobre hacer que crezca con el contenido,
además también crecerá con los elementos flotados.-->
overflow:hidden;
background:black;
}
#footer{
position:relative;
left:0;
top:0;
width:100%;
height:100px; <!--- el footer tampoco crecerá -->
overflow:hidden; <!-- además todo contenido que se pase no se verá-->
background:blue;
}
</style>
</head>
<body>
<div id="container">
<div id="header">
<!-- aqui el contenido de tu cabecera -->
</div>
<div id="wrapper">
<!-- aqui el contenido de tu texto y etc -->
</div>
<div id="footer">
<!-- aqui el contenido de tu pie de página -->
</div>
</div>
</body>
</html>