Rows and Columns (Responsive Design)

Pages on Experios are made up of grids, consisting of rows, which in turn contain columns.

These allow the page to wrap its contents from left to right and top to bottom, regardless of screen size. This is known as responsive design, and allows for the design of pages that look great on all device sizes, from mobile phone to desktop.

Rows can contain a maximum of 12 columns. You can, however, nest a row inside of a column, allowing for an additional 12 columns inside the parent. Rows and Columns can be dragged from the Add Content panel to the canvas and dropped in position. They can also be nested using the Insert button on the taskbar above an element when it is clicked.

Nesting Rows and Columns
Nesting Rows and Columns

Row heights and widths are set to ‘auto’ by default, meaning that they will always expand to fit their contents. These defaults can be changed from within the Properties panel to the right-hand-side of the canvas.

Elements must be placed inside a column. In the case that an element is added to the canvas outside of an existing row/column, Experios will automatically wrap the element in a new row/column.

Updated on June 24, 2022

Was this article helpful?

Related Articles