column layout, move panels without overlap

[eternasparta]

I’m trying to achieve something like this (http://docs.sencha.com/ext-js/4-1/#!...al/portal.html) but I want the portlets to be resizeable.

So I have a Ext.TabPanel with a Ext.layout.ColumnLayout layout.
All items are panel (Ext.form.Panel) with:

resizable : true,
draggable:true,

Specifically, given a initial situation like the following



I would like to be able to drag the highlighted portlet to a new position and have the other portlets “to make room” for it. Unfortunately, what I get right now is



i.e. two portlets overlap. I would like to get this instead (no overlapping):



So the question is: is there a way to achive this without requiring the columns to have a fixed size?

Thank you.

[scottmartin]

Have you considered making the panels in the portal re-sizable?

Scott.