How to make jQuery tabs() 100% high and content scrollable

Question

I am trying to create a JS web app with tabs. The speciality of the interface is that the tabs should be as high as the window is and the content should be scrolled if higher than the window. The content is built up from several left floated panels that fill the screen.

I already have part of the solution working but I cannot figure out how to set the 100% height and the scrolling for the container.

http://jsfiddle.net/KhwZS/1242/

<div class="tabs">
<ul>
    <li><a href="#tab1">Tab1</a></li>
</ul>
<div id="tab1">
    <div class="container clearfix">
        <div class="floated"></div>
        <div class="floated"></div>
        <div class="floated"></div>
    </div>
</div>

Answer 1

http://jsfiddle.net/KhwZS/1245/

CSS:

    html, body {
    height: 100%;
}
.tabs {
height: 100%;

}

#tab1 {
    height: 100%;
    overflow: auto;
}