The Layout panels are automatically adjusted to the sizes of the widgets inserted into them. JavaScript Table, Tree, Menu and other UI widgets can be easily integrated into the Layout.
Any row of this JavaScript widget can contain several columns, and each column can be divided into rows. Thus, you can nest one layout into another.
You can effortlessly change the size of Layout sections by moving resizing lines in different directions.
By default, layout elements without fixed dimensions evenly distribute the available space among themselves and can shrink/grow when window size changes. Fixed-sized elements of Webix Layout widget can also respond to the changes of the window size in two modes. The first mode allows to hide some views when there's not enough space to show them. In the second mode views are moved to another part of the layout to fit in the available space.
You can set borders, margins and padding to columns, rows and blocks of the JavaScript layout.
By default, when you create a layout for a Webix-based app, you have to define the combination of rows and columns containing particular components. Absolute Layout is an alternative to this approach. It allows you to place Webix widgets into cells with fixed width, height, and position.
Data Layout is intended to simplify the creation of applications with complex data structures. One of its distinctive features is the repeater mode. It allows defining a template that describes the structure of each item of the DataLayout, so you won't have to configure each widget manually.
You can create empty space in the layout cells vertically or horizontally, if you need to create an indent between the elements or align them in the Layout.
Layout – Part of Webix UI Library
Layout functionality
Layout – Part of Webix UI Library