Fit iframe into resizable div with header inside

Fit iframe into resizable div with header inside

I have an iframe which is a child of an div, which is resizable and
draggable so "position:fixed" doesn't work. To set the height and the
width to 100% doesn't work because the parent div of the iframe has a
header with a fixed size - so it would cause that the iframe slides out of
the parent div.
<style>
iframe{
position: absolute;
top: 50px;
right: 0px;
bottom: 0px;
left: 0px;
width: 100%;//is required, because right and left doesn`t seem to have any
use.
height: 100%;//50px to much..
}
</style>
<div class="draggable resizable">
<div>
<header style="height:50px;">some title</header>
<iframe src="">
</div>
</div>
I now that it would be possible with js or jQuery but I would need to call
the function everytime the resizable parent is resized.