Make a child div as tall as an auto height parent div

I have a wrapper element that contains two floated elements the contentArea and sidebar. contentArea has the most content and therefore determines the height of the wrapper element. I want the sidebar to touch the wrapper div's bottom edge as well. How do I do that. It's a basic wordpress blog layout.

HTML:

<div id="wrapper" class="clearfix">
    <div id="content">
        GROWS RE开发者_C百科ALLY TALL AS HAS SO MUCH CONTENT
        GROWS REALLY TALL AS HAS SO MUCH CONTENT
        GROWS REALLY TALL AS HAS SO MUCH CONTENT
        GROWS REALLY TALL AS HAS SO MUCH CONTENT
        GROWS REALLY TALL AS HAS SO MUCH CONTENT
    </div>
    <div id="sidebar">
        WANT'S TO BE AS TALL AS CONTENT.
        height:100%;   /*  doesn't work  */
    </div>
</div>

CSS:

#wrapper{
    height:auto;
    width:100%;
}
#content{
    height:auto;
    width:625px;
}
#sidebar{
    height:100%;
    width:335px;
}

Appreciate all the help.

Thanks

---

Is that what you are looking for?