Column Element

The column element basically enable you to create multiple columns in your header or section layout. This creates nested columns within a section which is a good way to design complex layouts. Columns are used as placeholders for all header/section elements. 

Note: By default a section or a header comes with two default columns when you drag it to your page. You can always add up to four columns.

Section Column Settings

The column settings are divided into two parts which are the width settings and the content position settings.

Column Width

In case you have two columns for instance, you can adjust one of the column’s width by % to a defined size of your choice. This ensures that the one column is bigger than the other depending on which content you are to set up there.

Content Position

In this case, you can set the content position with respect to the column box. There are several options to which the content position can be set which are: Inherent, Top, Bottom, and Middle.

Note: To adjust the gap between the columns you have created you can go  to the section settings and select a column gap from either: (Default, No gap, Narrow, Extended, Wide, Wider or Custom).

Header Column Settings

The header column settings are a little bit different in that they are responsible for elements alignment and width resizing.

Shrink Width

In case there is not enough space available this option defines how much a column should shrink.

Align Column elements

To align elements:

Click on the vertical and/or horizontal specific button.