Resizable div doesn't stay within containment parameter
<p>When resizing the middle div, it will not stay within the <code>containment</code> parameter on the right boundary of the grid, and it will not resize to the left.</p>

<p><a href="http://jsfiddle.net/dKuER/8/" rel="nofollow">http://jsfiddle.net/dKuER/8/</a> (clear example, updated)</p>

<p><strong>HTML</strong></p>

<pre><code>&lt;div id='grid'&gt;

    &lt;div class='outline first top'&gt;
        &lt;div class='container'&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class='outline top'&gt;
        &lt;div class='container resizable'&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class='outline last top'&gt;
        &lt;div class='container'&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class='outline first bottom'&gt;
        &lt;div class='container'&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class='outline bottom'&gt;
        &lt;div class='container'&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class='outline last bottom'&gt;
        &lt;div class='container'&gt;&lt;/div&gt;
    &lt;/div&gt;

&lt;/div&gt;
</code></pre>

<p><strong>JS</strong></p>

<pre><code>$(document).ready(function() {
    $('.resizable').resizable({
        containment: "#grid", // Updated to reflect answer, but wasn't the issue.
        handles: "ne,se,nw,sw"
    });
});​
</code></pre>
