how to inherit parent div height to its child

[amrhusen]

i do have 1 parent div and 2 child div, i want to these 2 child div will be equal to its parent height or whenever the content of 1 child div expand the other child div will expand as well. I like to use % instead of px so that when you zoom it in or out the height size stay the same or if any of you guys know some tricks to work for it i will appreciate it here's my js fiddle http://jsfiddle.net/deftmagic/29Puw/4/\[code\]<div class="content-wrapper"> <div class="task-pane"> <p>sample</p> <p>sample</p> <p>sample</p> </div> <div class="tbl-div"> <p>sample</p> <p>sample</p> <p>sample</p> <p>sample</p> <p>sample</p> <p>sample</p> </div></div>.content-wrapper{background:#000;min-height:0;width:100%; overflow:hidden; }.task-pane{ background:red; height:100%; width:20%; float:left; }.tbl-div { background:green; height:100%; width:80%; float:right;}\[/code\]note: guys i already search some of this same problem and it occur some do use table but my conflict to it is when i use table tag it can't provide to add div tag inside that i needed the most so please if there's any solution instead of table maybe some script i'll appreciate it-- thanks ^^