Cita:
Iniciado por juangemelo01
Código:
#innerPageWrapper {
background:red;
height:200px;
width:120px;
}
#innerPageWrapper p{
background: yellow;
height: 100%;
margin: auto;
width: 100px;
}
tengo la costumbre de ordenar el codigo alfabéticamente
lo que tienes que hacer es en
#innerPageWrapper es poner :
Código:
height:auto;
min-height:200px;
eso hara que cuando tu texto rebase los 200px de alto, esa altura se empiece a adaptar a lo que necesites, pruebalo y pon mucho mas texto en tu parrafo
ahi te daras cuenta que tiene un detalle y es que llega al fondo al igual que la caja de color roja que tienes, pero, eso lo puedes solucionar agregando un padding
con eso, las dimensiones de tu caja aumentaron 10px en cada lado, pero te sirve como margen entre tu borde y tu contenido de tu caja
dale un vistazo y prueba, cualquier cosa, comenta
Hola, muchas gracias por la respuesta, me ha servido como apunte pero no soluciona el problema.
El párrafo necesita tener un alto de 100% siempre, quiero decir, que este no aumente su altura al haber más texto, sino que su altura sea fija siempre, que ocupe el alto total de la capa "Parent".
He cambiado un poco el código en este Fiddle:
http://jsfiddle.net/8nWDE/271/
cambiando el párrafo por una capa, para hacerlo más simple. Si te fijas, la capa "inner" tiene altura de 100% como propiedad pero en cambio no toma altura. Lo siento si he creado confusión, pero resumiendo sería esto:
Parent: altura fija
Child: que se expanda a la altura total del Parent
Agradezco mucho tu ayuda.