Both fieldsets are expandable/collapsible.

The container div is supposed to be a wrapper that auto fills the space between a header and footer, which it does (using some simple CSS).

Here's what I'm trying to figure out: when both fieldsets are expanded, I want them to take up roughly 50% of the space available (there's some padding and borders and such). When one fieldset is collapsed but the other is expanded, I want the expanded fieldset to expand and fill the remaining space in the container.

Also, the wrapper div automatically resizes with page resize, because of the CSS, so the expandable fieldsets also need to resize.

I'm using jQuery 1.10.2 in Chrome version  31.0.1650.57 m.

Here is a simple graphic of what I'm trying to do: