Problem with jQuery dom resizable draggable containment

Question

Why doesn't jquery resizable () resize to the full width and height of the deterrent identifier assigned to it. You can try it http://jsfiddle.net/C8YSU/6/ and see what I mean. Try resizing the created div, it will not resize to the full width and height on the parent #container div. This is apparently caused by the draggable() function.

Answer 1

Adding a relative position to the #container div fixes the problem.

Answer 2

 <script type="text/javascript"> $("button").click(function () { var elm = $('<div id="divId" class="adiv abs"></div>'); elm.appendTo('#container').resizable({ containment: "parent" }); }); </script> 

Update

 <script> $("button").click(function () { var elm = $('<div id="divId" class="adiv abs"></div>'); elm.appendTo('#container').draggable({ snap: true, containment: 'parent' }).resizable({ maxWidth: 300, maxHeight: 300 }); }); </script> 

Answer 3

This is a problem with adding a dragged file to it.

Try this example. Drag and drop descriptors added.

http://jsfiddle.net/C8YSU/7/