Trouble with dragged revert at multiple block move

Question

At the following link : http://probl.frizi.net/ i'm trying to set variable size and position blocks. The colored blocks need to stay within the gray big block. Anyhow I'm trying to keep the colored blocks inside, they tend (at second movement) to deform or to go on a different possition as they started. Revert method is not working as it should or I didn't implemented it correctly.

Till far, I'm trying to do the following (please rightclick and see the Jquery source on the page):

var item;
$( "#droppable" ).droppable({
out: function(event, ui) { 
    $(item).draggable({ revert: true });
    var revert = $(item).draggable( "option", "revert" );
    $(item).draggable( "option", "revert", true );
    }
}); 

$(".blk").draggable({
    start: function(event, ui) { 
    item = $(this);
}
});