Positioning containers

The context menu item Rearrange sub containers is available for the Surrounding container, the Portal and application area and for all Containers that you have inserted as layout elements.

With this context menu item, all containers will be oriented with absolute positioning and automatic width and height in such a way that they border their neighboring containers to the left and right, and above and below. In the CSS, the attributes left and right, as well as top and bottom will therefore be recalculated.

With every element, it is possible to insert an additional element left, right, above, or below via the context menu, except for the Surrounding container and the Portal and application area.

These elements will be attached correspondingly to the end of the list of all subelements. If static positioning is selected in the properties of the elements, this is an easy way to orient elements on top of or next to one another.

The new element receives the same type of position and takes up, as long as the width and/or height of the old element is defined, one-third of the space of the old element. This will be reduced in space correspondingly. Therefore, new layout elements can always be inserted in this way, when an existing colored element is shown in a lighter color or a transparent element is shown in blue.

Selected containers that overlap other containers or are on top of sibling containers (or vice versa) will be bordered in red.

Overlaps can make sense for the layout creation process, but they can also, in certain circumstances, cause elements to become invisible or unusable later on in the end device. For overlapping elements, you need to take care that the order in the structure tree is correct, i.e. that the Z-index of the elements is correct. The Z-index defines the arrangement of the elements on the various levels. The element with the greater Z-index will be displayed in the foreground; for the same Z-index, the most recently added element will be placed in the foreground.