Hola!
Tengo una estructura con dos columnas (divs) y quiero que al agregar más texto en la columna principal (la d ela izquierda y más ancha) la otra columna extienda su altura de forma automática.
Les dejo el código que hice a ver si alguien me puede guiar, desde ya muchas gracias.
Código HTML:
<div id="contenedor">
<div id="fondogris">
<div id="fondoblanco">
<p>a,sknd.akdsnf.akdnf.aknd.asdmn.askdna.ksndlaksndlkasndlkasndaslkndalksndlasknd</p>
<p>as.dna.sdn.askdnas.lndsa.lkndsalkdnas;lkdnasldjbakjbfkajsbfkajsbfjasbf</p>
<p>aksjfbaskjbfajskbfasjfb</p>
<p> </p>
<p>asf baksjbflaskbflaskfbslkafblaksfblkasfblaskfblaskjnalskdjlsakdjnlaskdnlkasndlkasndlkasndlkasndl</p>
<p>a.s,dm.asmdal;ksmd;alsdm;asldm;alsdm</p>
<p> </p>
<p>.lmdsal;smd;alsmd;alsmd;lasdmasl;dmalsdmlkasncljabkjsabckiuSVKU</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<div id="contacto">
<p>contacto</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
</div>
</div>
</div>
Código:
body,td,th {
font-family: Arial, Helvetica, sans-serif;
text-align: center;
}
body {
background-color: #E9E9E9;
text-align: center;
}
#contenedor{
width:1000px;
height:auto;
background-color: #CCC;
margin: 0 auto;
}
#fondogris{
background-color:#999;
width:1000px;
height: auto;
margin-top: 121px;
position: absolute;
float: left;
}
#fondoblanco{
background-color:#FFF;
width:681px;
height: auto;
position: relative;
margin-top: 110px;
margin-left: 17px;
padding-left: 75px;
padding-top: 15px;
float: left;
text-align: left;
font-size: 13px;
}
#contacto{
position:relative;
margin-top:-341;
margin-left: 791px;
height: auto;
width: 205px;
background-color: #CCC;
border-left: #1A1A1A solid medium;
float: left;
}