I suspected that your solution was to be found in using the CSS position property since, combined with the top/right/bottom/left properties, it is a major layout determinant particularly for fluid layout. Where possible you want to avoid the absolute determination of container/box dimensions, which means not specifying dimensions with absolute distances (px, em, en, cm, etc). You want percentages if you can. Sometimes that is unavoidable especially if your content is a lot of images which, when re-sized, makes the image look like crap.
Anyway, you have containers within containers within containers, and you want them the 3rd level to perhaps to have its top and bottom change with the parent container top and bottom, the contained glued to the containing. There is a way to do that with position.
After looking at tens and tens of pages (often using StumbleUpon with the keyword search 'CSS') but knowing I was looking for examples of the advanced use of the position property, I was struck to think more deeply when I read this page and in the section called Using Absolutely Positioned Elements Inside Relatively Positioned Containers (it's about two-thirds down).
I made changes to your JSFIDDLE content to demonstrate. Note that I moved the Sidebar div to another location, but it may not matter, just so long as it is contained inside Wrapper.
The use of CSS position property is one of the box model's big mysteries to me, although I understand its importance. What I really don't understand is that the CONTAINING (parent) block element must be POSITIONed as RELATIVE while the CONTAINED (child) block elements must be POSITIONed as ABSOLUTE, and then you use TOP, BOTTOM, and LEFT and RIGHT as the distance of the edges of the contained block from the containing block (in effect, these are "margin"s). That fixes Sidebar with respect to Wrapper. But now you want to adjust the child box element Top, Body, and Bottom inside Sidebar. Well, in this case, I specified them as percentages of the height of Sidebar: I said Top and Bottom are 10% and Body is 80%. If you leave those height percentages out, they fill up according to what they are containing (in text/image/whatever) content.
Depending on your content, you should strive for fluid layout...meaning block elements are re-sized as much as possible when the user re-sizes the window. Of course you will want to avoid too much width (long lines of text) and too little width, so specifying min- and max-width might be useful.