Es mi primera intervención en este foro... asique les pido condescendencia
Tengo una capa principal que contiene a otras dos. Estas dos capas tienen z-index y una altura cualquiera. El problema es que la capa principal no crece con sus hijas, apareciendo dicha capa principal como si tuviera altura cero (Creo que la posición absoluta de las capas hijas es lo que hace que se salgan del flujo de la capa padre, pero es que si no pongo la posición absoluta, el z-index no me funciona)
Si alguien tiene alguna idea les estaría agradecido y espero que Dios se lo pague (de vez en cuando miren al cielo y a lo mejor cae algo...)
El codigo css y el html son los siguientes:
CSS
---
body {
font-family: Arial, Helvetica, sans-serif;
font-size:0.80em;
line-height:1.16em;
}
#principal{
position:relative;
margin:10px auto;
border:4px solid #FF0000;
width:43.1em;
}
#capa_1{
position:absolute;
color:#FFFFFF;
width:30%;
border:2px solid #0000FF;
background-color:#000000;
z-index:200;
}
#capa_2{
position:absolute;
left:10px;
width:40%;
border:2px solid #FF00FF;
padding:40px 0px 0px 0px;
z-index:100;
}
HTML
----
<body>
<div id="principal">
<div id="capa_1">Primer Plano</div>
<div id="capa_2">Segundo plano</div>
</div>
</body>
</html>
Muchas gracias
--------------
Para vivir mejor, caminar siempre por la sombrita