Moving content inside of a div?
<p><strong>UPDATE:</strong></p>

<p>The parent div (#container) must have a fixed height.  I jsut want to shift the content in it so the active div is at the top and all overflow is hidden.</p>

<hr>

<p>I am working on a webpage where a parent div has a fix size and will have several child divs in it.  Each of these child divs will have an anchor tag that is always visible and it's own child div that will only be shown when it's sibling anchor tag is clicked.</p>

<p>I have this much working but I am running into the issue that when the sibling div is shown it sometimes goes out of the parent div and it's content is hidden.  I would like to have the contents of this div repositioned to the top of the parent div so that it's content is never hidden.  How would I accomplish this using jQuery?</p>

<p>You can see what I'm talking about by clicking Item2 in this Fiddle: <a href="http://jsfiddle.net/Broham/LA22t/1/" rel="nofollow">http://jsfiddle.net/Broham/LA22t/1/</a></p>

<p>Html:</p>

<pre><code>&lt;div id="container"&gt;
    &lt;div class="item"&gt;
        &lt;a href="#"&gt;Item1&lt;/a&gt;
        &lt;div class="desc"&gt;A bunch of stuff about item 1!&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="item"&gt;
        &lt;a href="#"&gt;Item2&lt;/a&gt;
        &lt;div class="desc"&gt;
            A bunch of stuff about item 2!&lt;br/&gt;More stuff for item 2!&lt;br/&gt;last item 2 thing
        &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="item"&gt;
        &lt;a href="#"&gt;Item3&lt;/a&gt;
        &lt;div class="desc"&gt;
            A bunch of stuff about item 3!&lt;br/&gt;More stuff for item 3
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>css:</p>

<pre><code>.desc
{
 display:none;   

}

#container
{
    height:75px;
    overflow:hidden;
    border-style:solid;
    border-width:1px;
}
</code></pre>

<p>jQuery:</p>

<pre><code>$(".item a").click(function () {
    $(this).siblings(".desc").animate({ height: 'toggle' });
            });
</code></pre>

<p>What I have tried so far:</p>

<p><a href="http://jsfiddle.net/Broham/LA22t/3/" rel="nofollow">http://jsfiddle.net/Broham/LA22t/3/</a></p>

<p>But this only moves the active div, what I need to do is shift all of the content up and hide the overflow...</p>
