css - Make two divs side by side, one is resizable and the other has same height -

i bring here drama css height.

i make layout, div contains 2 divs both in same line, 1 resizable , other must fit in parent's height (same height first one).

the first div can have additional information (so can't fix height), have more lines, important must not have scroll bar. second div must obey first height, if it's bigger have scroll bar.

<div class='container'> <!-- parent -->     <div class='left'> <!-- resizable -->     </div>     <div class='right'> <!-- same height left div  -->     </div> </div> 

unsolved code

the problem can't figure out how make using css. or it's possible css. not use js.

someone please me!

fiddle

what make right 1 absolutely positioned stops height influencing parent's.

relevant css

.container {     background-color: gray;     display: table;     width: 70%;     position:relative; }  .container .left{     background-color: tomato;     width: 35%; }  .container .right{     position:absolute;     top:0px;     left:35%;     background-color: orange;     width: 65%;     height:100%;     overflow-y: auto; }