jQuery : Resizing the layouts
<p>I want re-sizable feature like <code>jsFiddle</code> : <a href="http://jsfiddle.net/" rel="nofollow">link.</a>     If i explain in my own words there are four layouts<br>
 <code>[1. HTML, 2. javascript, 3. CSS &amp; 4.Result]</code> and we can re-size the layout inwards &amp; outwards. I have been tried to make resizable using jQuery but failed to do like jsFiddle.</p>

<pre><code>    my example:  CSS 
 #parent { position:relative; width 100%; height:100%;}
    #left {position:absolute;left:0; width:48%;height:100%; border:1px dashed; }
    #right {position:absolute;right:0; width:48%;height:100%; border:1px dashed; }

    &lt;div id = "parent"&gt; 
      &lt;div class="resize" id = "left"&gt; &lt;/div&gt;
      &lt;div class="resize" id = "right"&gt; &lt;/div&gt;
    &lt;/div&gt;
    js: $(function() { $('.resize').resizable(    { handlers: 'n,e,s,w' }    ); 
    });
</code></pre>

<p>in example, there are two layout <code>left &amp; right</code>, are equals in size. when i resize any div then other div should change it's size too but it doesn't make any difference in size while jsFiddle does. </p>
