Buenas a todos, os expongo mi problema, que por más vueltas que le doy no soy capaz de superar, primero os explico un poco de que va la cosa y a continuación os pongo el código:
Tengo una web, al 100% de alto tanto el html como el body (el html también tiene overflow:hidden, ya que solo quiero que me salga scroll en un div en concreto) con 3 columnas, en la columna central (que es donde está todo el contenido) debajo de la cabecera, tenemos el div "contenido" también con una altura del 100%. Este div, cuando sea pertinente debe aparecer un scroll vertical, y no soy capaz de dar con la clave.
Si pongo overflow:auto en el div colCentral si me sale el scroll, pero solo en la cabecera.
Muchas gracias por la ayuda.
Estas son las css (os quito la "morralla" del código para que se vea más claro:
Código:
/* GENERALES */
html{height:100%; overflow:hidden;}
body{height:100%; font: 100%; padding:0; margin:0; text-align:center;}
ol,ul {list-style:none;}
img{border:0;}
/* POSICIONAMIENTO DE TODAS LAS COLUMNAS */
#contenedor {width: 100%;height:100%; margin: 0 auto; text-align: left; min-width:1020px;}
#colIz{float: left; height:100%; width: 15%; background: #ffffff; border-right:solid 2px #ffb006;}
#colDer{float: right; height:100%; width: 15%; background: #ffffff; border-left:solid 2px #ffb006;}
#colCentral{text-align:left; height:100%;}
/*Contenido*/
#contenido{padding:20px 4px; text-align:left; font-size:0.7em; overflow:auto;}
#contenido p{padding:0 20px; }
/* Varias clases diversas para su reutilización */
.fltrt {float: right;margin-right: 10px; margin-top:3px;}
.fltlft {float: left;}
.clearfloat {clear:both;height:0;font-size: 1px;line-height: 0px;}
Y aquí el html:
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ".../TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Documento sin título</title>
<link href="App_Themes/estilos2.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="contenedor">
<!-- COLUMNA IZQUIEDA -->
<div id="colIz"></div>
<!-- COLUMNA DERECHA -->
<div id="colDer"></div>
<!-- CONTENIDO -->
<div id="colCentral">
<div id="cabecera">Aqui viene el menu, logos, etc...</div>
<div id="contenido">Este es el div en cuestión, cuando haya más contenido que lo que ocupe la ventana del navegador, debería salir el scroll
</div>
</div>
<br class="clearfloat" />
</div>
</body>
</html>