The 'Columns' element is a powerful layout tool that allows you to place content side-by-side on your campaign screens. It's perfect for creating sophisticated designs, such as displaying an image next to a block of text or showing two competing options.
How to Add and Populate Columns
- On any campaign Landing page, click the "+ Add" button between elements and select the 'Columns' element from the list.
- Two empty columns will appear. You can now add any other element (like a Text block, Image, or Button) inside each column by clicking the '+' icon within it.
- Once you've added content to each column, you can edit those individual elements just like any other element in your campaign.
Customizing the Columns Container
After adding content to your columns, you can customize the appearance of the main container that holds them. Select the 'Columns' element itself in the editor to access these settings.
Layout & Spacing
- Vertical Alignment: Align the content within the two columns to the top, center, or bottom, ensuring they look great even if one column has more content than the other.
- Column Widths: Adjust the width of each column. For example, you can make one column take up 70% of the space and the other 30%.
- Spacing: Control the amount of space between the two columns.
- Background: Choose the color of the background of the columns for both Desktop and Mobile devices