como alterar a altura de uma div dinamicamente com base em outra div usando css?
aqui está meu código
HTML:
<div class="div1">
<div class="div2">
Div2 starts <br /><br /><br /><br /><br /><br /><br /> Div2 ends
</div>
<div class="div3">
Div3
</div>
</div>
CSS:
.div1 {
width: 300px;
height: auto;
background-color: grey;
border: 1px solid;
overflow: auto;
}
.div2 {
width: 150px;
height: auto;
background-color: #F4A460;
float: left;
}
.div3 {
width: 150px;
height: auto;
background-color: #FFFFE0;
float: right;
}
Eu quero aumentar a altura do div3 dinamicamente.
por exemplo, se a altura de div1 for 500px, a altura de div3 deverá ser 500px. Eu sei que eu posso usar herdar, mas a coisa é altura de div1 é auto por isso não vai ajudar. aqui está meu violinohttp://jsfiddle.net/prashusuri/E4Zgj/1/ como fazer isso?
obrigado