Break up your content using Columns. They are better suited to keeping the content mobile friendly and flexible. They can be a great replacement for Tables in many cases.
Columns can be placed anywhere within your page content.
- Click to place your cursor where you want the columns to be added and then click the black "Add Block" icon that shows to the left of the cursor.
- Select the Columns icon
- Either select and change the number or use the arrows to select the correct number of columns you want to add into the page.
- Click the checkmark to confirm and inject your new columns!
There will now be a row of gray outlined boxes (the border is only visible when editing) of equal widths stretching across the editable area of your page. You may use theses spaces the same way you use any other editable space.
How Columns display
Columns are always equal width. Unlike a Table, you cannot create columns where one column is narrower than the other.
When viewed on a mobile device, columns will stack. The first column will take the top spot, the next column will display underneath the first. Each additional column will display under the one to its left when the display screen is too small for them to display across in a row.
This stacking characteristic is important to remember when adding content to the columns. For example, you wouldn't want to create column content that reads horizontally across the page because on a smaller screen, that information will be vertical. We suggest testing the display on various sized screens before spending a lot of time with the content.
Remember, you can add several sets of columns to create a display that works on all screen sizes.