title: Resize after droppable is not working
body: <p>I am going through the odd problem ,, The things are messed up between the Resizable and the droppable Jquery Events . </p>
  
  <p><strong>Problem</strong></p>
  
  <p>I have div which i can easily resize . but i am not able to resize after i drag and drop this div into the droppable area. Can any one help about this.</p>
  
  <p>This is my <a href="http://jsfiddle.net/c38WX/25/" rel="nofollow"><strong>Demo Fiddle</strong></a></p>
  
  <p>I have following code </p>
  
  <p>Jquery </p>
  
  <pre><code> function makeDraggable() {
              $(".selectorField")
                  .draggable({
                      containment: $('body'),
                      helper: "clone",
                     cursor: "move",
                      cancel: null
                  });
          }
          $(function () {
              var _ctrl_index = 1001;
              $(".resize_box").resizable({ handles: 'e' });
  
              makeDraggable();
              $(".droppedFields").droppable({
                  accept: ":not(.ui-sortable-helper)",
                  drop: function (event, ui) {
                      var draggable = ui.draggable;
                      draggable = draggable.clone();
                      draggable.appendTo(this);
                      makeDraggable();
                  }
              });
  
          });
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="selectorField resize_box" style="height: 100px; width: 100px; background-color: green;"&gt;&lt;/div&gt;
  
  &lt;div style="height:100px; width:100px;" &gt;&lt;/div&gt;
      &lt;div id="Section1" style="height: 100px; line-height: 20px; width: 100%; border: 1px dotted red; display: table;"&gt;
  
          &lt;div class="well droppedFields ui-sortable" style="width: 73px;"&gt;&lt;/div&gt;
  
      &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code> #Section1 &gt; div {
              display: table-cell;
              border-right: 1px dotted red;
              text-align: center;
          }
  </code></pre>