can you give a short code-example, please?

The only way is to create a specific dock for each container and set to the corresponding container the id as dock. In that way each container will dock exactly into its space and in the order you give it.

Here is a short code example:

create your containers:

<div class="containerPlus draggable resizable {buttons:'m,i,c', icon:'alert.png', skin:'white', width:'500', content:'test.html',dock:'dock1',iconized:'true'}" style="top:100px;left:500px">...</div>

<div class="containerPlus draggable resizable {buttons:'m,i,c', icon:'alert.png', skin:'white', width:'500', content:'test.html',dock:'dock2',iconized:'true'}" style="top:100px;left:500px">...</div>

<div class="containerPlus draggable resizable {buttons:'m,i,c', icon:'alert.png', skin:'white', width:'500', content:'test.html',dock:'dock3',iconized:'true'}" style="top:100px;left:500px">...</div>

As you can see I set for each container a specific "dock" property.

Now, in your dock area you set an element for each container with the ID specified:

<div class="dockArea"><span id="dock1"></span> <span id="dock2"></span> <span id="dock3"> </span></div>

When you'll dock the containers they will have their specific place.