3 Columns
Last updated
Last updated
The 3 Columns element provides a quick way to add a full width three column layout to your page.
NOTE: The 3 Columns element has options preset to show the three columns for desktop screen sizes and a single column for all other screens.
This is a composite element made up of the following elements:
1 Layout Row inside the layout container.
3 Layout Column elements inside the layout row.
Example Text elements inside the layout columns
The following element options options are preset:
Layout Container set for full-width
Layout Row set to center align horizontally and vertically.
Layout Columns are set to use 100% width at the main setting and overridden to Default for the desktop screen size. So this will show a three column view for desktop and single column view for all other screen sizes.
Layout Columns have a margin at the bottom by using the Custom CSS Classes setting. For more information on adjusting the spacing see Padding and Margin.
Feel free to change the preset options and delete the example Text elements.
You may also add additional columns to the layout row by:
Using the Add Column Element.
Cloning one of the existing layout columns.
Additional rows can also be added by cloning the existing layout row.
