Hola!!
Tengo un problema y ya estoy desesperado jajajaja
Tengo tres columnas. He conseguido que las tres tengan la misma altura, gracias a la propiedad css "display". El problema ahora es que no me funciona ( o no sé cómo hacerlo ) el overflow. Os cuento, las tres columnas ( QUE SON DIVS ) deben ocupar la misma altura. Pero en función del contenido debe mostrar scroll el div correspondiente. Y no lo consigo! Cada div escribe todo su contenido! Y las columnas pasan a tener la altura del div con mayor contenido.
Concretamente, el div central contendrá una imagen. La altura de las tres columnas debe tener la altura de la imagen. Y los divs de izquierda y derecha mostrarán scroll, si su contenido supera la altura del div central ( la imagen ).
Os paso mi código. Veréis aquí en el div central he puesto texto largo simulando la altura que ocuparía la imagen. No soy capaz que los divs laterales saquen el croll si supera la altura de la imagen.. Si alguien sabe cómo hacerlo se lo agradeceré.
El código:
<html>
<head>
<style type="text/css">
#contenedor {
display: table;
width:80%;
background:red;
}
#contenidos {
display: table-row;
width:100%;
background:blue;
}
#columna1 {
display: table-cell;
width:25%;
background:pink;
vertical-align: top;
}
#columna11 {
width:25%;
background:magenta;
vertical-align: top;
height:100%;
overflow:auto;
}
#columna2 {
display: table-cell;
width:50%;
background:yellow;
}
#columna3 {
display: table-cell;
width:25%;
background:red;
vertical-align: top;
}
</style>
</head>
<body>
<div id="contenedor">
<div id="contenidos">
<div id="columna1">
<div id="columna11">
a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br> a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br> a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>
</div>
</div>
<div id="columna2">
bbLorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
bbLorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
<div id="columna3">ccLorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy</div>
</div>
</div>
</body>
</html>
Muchísimas gracias!!!