JavaScript is disabled on your browser.

Positioning Elements

The context menu item Reorient subcontainer can be found with 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.

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

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, in this way one can orient elements very easily on top of one another 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. New layout elements then also always be inserted in this way, when an existing element in color 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 later on in the end device to become invisible or unusable. For overlapping elements, one must 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.