Skip to main content

Layout patterns

DHTMLX Layout patterns are predefined combinations of rows and columns that provide you with various options of arranging cells inside of a layout in a neat structure. The patterns are named in accordance with their structure. Each scheme is similar to a Latin letter.

Click on the desired pattern to see its example in Snippet Tool.

1C layout pattern with a single cell in DHTMLX Suite 2E layout pattern with two stacked rows in DHTMLX Suite 2U layout pattern with two side-by-side columns in DHTMLX Suite

3E layout pattern with three stacked rows in DHTMLX Suite 3W layout pattern with three side-by-side columns in DHTMLX Suite 3J layout pattern with a full-width top row over two columns in DHTMLX Suite 3L layout pattern with a left sidebar and two stacked cells on the right in DHTMLX Suite 3T layout pattern with two top columns over a full-width bottom row in DHTMLX Suite 3U layout pattern with two top columns over a full-width bottom row in DHTMLX Suite

4E layout pattern with four stacked rows in DHTMLX Suite 4W layout pattern with four side-by-side columns in DHTMLX Suite 4T layout pattern with three top columns over a full-width bottom row in DHTMLX Suite 4U layout pattern with a full-width top row over three columns in DHTMLX Suite 4H layout pattern with side columns around a stacked center column in DHTMLX Suite 4I layout pattern with two full-width rows over two bottom columns in DHTMLX Suite 4A layout pattern with two outer columns around two stacked center rows in DHTMLX Suite 4L layout pattern with a left column beside three cells on the right in DHTMLX Suite 4J layout pattern with two full-width top rows over two bottom columns in DHTMLX Suite 4F layout pattern with a full-width top row over a column and stacked cells in DHTMLX Suite 4G layout pattern with three stacked rows beside a right column in DHTMLX Suite 4C layout pattern with a left column beside three stacked rows on the right in DHTMLX Suite

5E layout pattern with five stacked rows in DHTMLX Suite 5W layout pattern with five side-by-side columns in DHTMLX Suite 5U layout pattern with a full-width top row over four columns in DHTMLX Suite 5H layout pattern with side columns around three stacked center rows in DHTMLX Suite 5I layout pattern with a full-width top row over two rows and bottom columns in DHTMLX Suite 5K layout pattern with two stacked left cells beside two stacked right cells in DHTMLX Suite 5S layout pattern with two stacked left cells beside two stacked right cells in DHTMLX Suite 5G layout pattern with three stacked left rows beside a right column in DHTMLX Suite 5C layout pattern with a left column beside stacked rows on the right in DHTMLX Suite