Estoy intentando hacer una pagina super sencilla. Pero me he quedado atorado con algo muy trivial.
Es una pagina a 3 columnas, la idea es que la columna central cambie el ancho dependiendo del tamaño de la pantalla
Ya logre hacer eso, pero no logro hacer que el alto de la columna derecha se ajuste automatico, es decir, con 2 imagenes le podria poner un alto especifico, pero puede ser que solo inserten 1 o 3 imagenes, y no se auto ajusta.
Quiza sea algo muy sencillo, se que lo es, pero no encuentro la forma, asi que me acerco ustedes expertos para recibir su orientacion.
El codigo que tengo del esqueleto, le puse unas plastas de color en el fondo para ver hasta donde abarca cada div, solo para guiarme.
Una disculpa por causar molestias, de antemano muchas gracias.
Es una pagina a 3 columnas, la idea es que la columna central cambie el ancho dependiendo del tamaño de la pantalla
Ya logre hacer eso, pero no logro hacer que el alto de la columna derecha se ajuste automatico, es decir, con 2 imagenes le podria poner un alto especifico, pero puede ser que solo inserten 1 o 3 imagenes, y no se auto ajusta.
Quiza sea algo muy sencillo, se que lo es, pero no encuentro la forma, asi que me acerco ustedes expertos para recibir su orientacion.
El codigo que tengo del esqueleto, le puse unas plastas de color en el fondo para ver hasta donde abarca cada div, solo para guiarme.
Una disculpa por causar molestias, de antemano muchas gracias.
Código:
div#encabezado {
clear: both;
float: none;
margin: 0px auto;
position: relative;
min-width: 1020;
width: 100%;
}
div#contenido {
clear: both;
float: none;
background-color: yellow;
position: relative;
width: 100%;
height: 100%;
top: 0;
bottom: 0;
min-width:1020px;
}
div#panelIzquierdo {
background-color: red;
position: absolute;
top:0;
left: 0;
width: 180px;
/* float: left;*/
height: 100%;
}
html>body div#panelCentral{
background-color: #ccc;
margin-left: 181px;
margin-right: 351px;
margin-top: 0px;
height: 100%;
color: #9C9E9F;
line-height: 38px;
}
/**********************/
div#panelDerecho{
background-color: green;
position: absolute;
float: right;
top: 0;
right: 0;
width: 320px;
height: 100%;
color: #9C9E9F;
line-height: 38px;
}
/*** ***/
div#footer {
background-color: maroon;
clear: both;
position: relative;
float: left;
width: 100%;
top:50px;
padding: 3 10 3 10px;
min-width:1020px;
}
