With the layout row "Row 3 columns (adjustable widths) ", the columns can be designed with varying widths to suit the content.

For example, a larger text area can be displayed alongside two smaller areas with supplementary information.

On smartphones and smaller screens, the columns remain clearly arranged one below the other.

Two new element settings are available for designing the layout row: The width of individual columns can be determined with "Column widths".

Via "Main column position" it is specified if the most important content area is displayed on the left, in the center, or on the right.

The setting "Column widths" determines how much space the three columns receive. The numbers represent the columns from left to right.

The following configurations are predefined:

• 6-3-3: The left column occupies half of the row. The other two columns each occupy a quarter.
• 3-3-6: The right column occupies half of the row.
• 3-6-3: The middle column occupies half of the row.
• 6-4-2: The columns become progressively narrower from left to right.
• 7-3-2: The left column receives particularly ample space.

Custom configurations can also be entered. To do so, the three numbers must be separated by hyphens. The sum of the numbers must always equal 12, for example 5-4-3 or 8-2-2. If the input is incorrect, the setting cannot be saved.

The setting "Main column position", defines which of the three columns contains the most important content: the left, middle, or right column.

The values set under "Column widths" still apply from left to right. The main column is therefore not automatically the widest. For example, with a 6-3-3 split and the selection "Middle", the main middle column is three units wide.

Note: If you later change the position of the main column, the elements it contains will move along with the column. On smartphones, the main column is displayed first by default, regardless of this setting.