Ver Mensaje Individual
  #1 (permalink)  
Antiguo 19/11/2010, 16:00
Avatar de ravalos7
ravalos7
 
Fecha de Ingreso: diciembre-2005
Mensajes: 102
Antigüedad: 18 años, 3 meses
Puntos: 0
Pregunta Ayuda urgente con div de alto automatico al 100%

Amigos,

No crean por favor que no he buscado antes en el foro, viendo los temas antiguos sobre este problema, pero nada me ha resultado.

Estoy construyendo el siguiente sitio: http://buscaconce.technodis.cl/

En este sitio, existe un div central el que deseo que por lógica se vaya expandiendo según el contenido, cosa que en la practica no ocurre, sino que el contenido pasa por encima del contenedor.

Vean el mismo sitio pero con los ultimos cambios que comento:http://buscaconce.technodis.cl/test

Al pinchar sobre cada uno de los encabezados de las noticias y desplegarse estas, el conjunto sobre pasa al contenedor, en vez de que el contenedor se expanda o este por defecto al 100% para que no ocurra.

Como se imaginaran he modificado por css esa capa colocando estilos como los sig.

- heigth:100%:
- min-heigth:100%;


- top 0;
bottom:0;
height:auto;
min-heigth:100%;


Nada de lo anterior funciona. Ya casi tengo el listo el sitio para entregarlo, pero no puedo porque esa dichosa capa no se expande, idealmente al 100% de la página. He intentado todo lo que se me ha ocurrido pero no funciona.

Les comento que esta capa llamada #hoja, tiene una contenedora llamada #content. Aquí les va los estilos que estoy implementando.

Código CSS:
Ver original
  1. * {
  2. padding: 0;
  3. margin: 0;
  4. }
  5.  
  6. html,body{
  7. padding: 0px;
  8. margin: 0px;
  9. height: 100%;
  10.  
  11. }
  12.  
  13. #content{
  14.     left:0px;
  15.     right:0px;
  16.     width:auto;
  17.     position:absolute;
  18.     top:0px;
  19.     bottom:0px;
  20.     padding-bottom:30px;
  21.     height:100%;
  22.     min-height:100%;
  23. }
  24.  
  25. #hoja{
  26.     background: repeat #FFF;
  27.     display:block; 
  28.     width:850px;
  29.     left:50%;
  30.     margin-left:-425px;
  31.        
  32.     position:absolute;
  33.     top:0px;
  34.     bottom:0px;
  35.     height:auto;
  36.     min-height:100%;
  37.  
  38.    
  39.     z-index:1;
  40.    
  41.     -moz-border-radius: 14px;
  42.     -webkit-border-radius: 14px;
  43.     -khtml-border-radius: 14px;
  44.     border-radius: 14px;
  45.     border:#fff 1px solid;
  46.    
  47.     -moz-box-shadow: 7px 7px 10px #333;
  48.     -webkit-box-shadow: 7px 7px 10px #333;
  49.     -khtml-box-shadow: 7px 7px 10px #333;
  50.     box-shadow:7px 7px 10px #333;
  51.     display:block;
  52. }

Les agradezco desde ya la ayuda que me puedan dar.

Saludos desde Chile,

Ricardo