Tengo dificultades para lograr esto. Me gustaría que el div content1
y el content2
llenen verticalmente el espacio restante en una ventana con una altura mínima establecida.Cómo hacer que css div se extienda al 100% de la ventana
<style type="text/css">
body,td,th {
font-family: Arial, Helvetica, sans-serif;
height:100%;
}
body {
background-color: #E1E1E1;
}
</style>
<style type="text/css">
.container {
width: 965px;
height: 100%;
margin: 0 auto;
overflow: hidden;
}
.sidebar1 {
float: left;
width: 200px;
background: none;
padding-bottom: 10px;
} .content {
padding: 10px 0;
width: 380px;
height: 100%;
background: #fff;
float: left;
position: relative;
} .content2 {
float: left;
width: 380px;
height: 100%;
background: #fff;
padding: 10px 0;
}
-->
</style>
Éstos son los divs que estoy tratando de cambiar el tamaño (actualmente vacío pero me gustaría que para llenar la ventana verticalmente):
<div class="content" style="border-left: solid 1px #CCC;"></div>
<div class="content2"><!-- end .sidebar2 --></div>
no su trabajo :-( – methuselah
Se trabajará yo sólo comprobado en todos los navegadores – Mahima
@jeansymolanza, ver el jsFiddle añadí para una demostración. – Petah