Draggable elements parent automatic resize

Draggable elements parent automatic resize

Hello, I'm pretty new to jQuery and I'm making a page with widgets that can be placed using drag and drop. I am currently using the newest jQuery and jQuery UI. However I have the following problem and maybe someone can help me out.
 
If I this post is misplaced please correct it for me, thank you.
 
I have the following code:
 
  1. $(document).ready(function(){ 
  2.  $(".widget_wrap").draggable({containment: 'parent',
  3.          drag: function(ui, event){
  4.           $("#navigation").text("Item: Left: " + $(this).position().left + " " + "Top: " + $(this).position().top);
  5.           }});
  6. });
    However when I drag my "widget_wrap" element the parent will actually shrink to the y position where my widget is. But I want to be able to get the widget to go as low as possible. So my parent element needs to resize itself when the widget hits the "bottom". I only want this to happen vertically, not horizontally. How can I do this?
    Thanks for your responses!