Hola, me estoy descocando tratando de hacer lo que dice el título. Tengo un div "noticias" dentro del cual hay tres divs:
- cuadro-noticias1
- linea-vertical2
- cuadro-noticias2
Se supone que dentro de "noticias" los otros div queden como tres columnas.
lo que quiero hacer es que el div padre "noticias" se estire cuando se cargue el contenido en los divs hijos "cuador-noticias1 y 2" y arrastre a su alto dinámico a la linea que los separa, dandole el mismo alto.
Hasta ahora logre todo, menos que la línea copie la altura del div "noticias".
En el css:
Código HTML:
#noticias{
position:relative;
overflow: hidden;
text-align:center;
background-color:#fffff1;
margin:0 auto 0 auto;
width:935px;
padding-bottom:40px;
}
#noticias #cuadro-noticias1{
float:left;
background-color:#cccccc;
width:410px;
height:inherit;
margin-left:40px;
}
#noticias #linea-vertical2{
float:left;
height: 100%;
background-color:#FF0000;
width:2px;
margin-left:17px;
margin-right:17px;
margin-top:30px;
}
#noticias #cuadro-noticias2{
float:left;
background-color:#cccccc;
width:410px;
height:inherit;
}
<
y en el html:
Código HTML:
<div id="noticias">
<div id="cuadro-noticias1"></div>
<div id="linea-vertical2"></div>
<div id="cuadro-noticias2"></div>
</div>