Learn to vertically align your Blocks in a Section when customizing your pages.
In this article:
Tip:
Enable the grid overlay while designing your page. Enabling the grid tool can help you align your layout to look great every time.
Aligning blocks with equal heights block
Enable Equal Heights Block to change the vertical length of each Block in the row to equal the height of the tallest Block in the row:
- Open the Website tab from the Dashboard.
- Select the Pages tab.
- Open the page editor for your Page. Learn more
- Navigate to the left sidebar panel and select the Section you wish to edit.
- Scroll to Section Settings.
- Click Desktop Layout.
- Check Equal height Blocks to align all Blocks to the tallest Block in the row. (If you have multiple rows in a Section as shown below, repeat for the rows you wish to align.)
- Click Save to keep your changes:
Note:
Enabling Equal Height Blocks will not change the height of your uploaded images in order to retain the original image ratio. Instead, your images will vertically align to the top of the tallest Block in its row.
Aligning blocks with vertical alignment
Vertically align all Blocks in a Section to the top, bottom, or center of the tallest Block in the row by adjusting the Desktop Layout Vertical Alignment setting:
- Open the Website tab from the Dashboard.
- Select the Pages tab.
- Open the page editor for your Page. Learn more
- Navigate to the left sidebar panel and select the Section you wish to edit.
- Scroll to Section Settings.
- Click Desktop Layout.
- Open the Vertical Alignment dropdown menu.
- Select Top to align all Blocks to the tallest Block in the row. (If you have multiple rows in a Section as shown below, repeat for the rows you wish to align.)
- Click Save to keep your changes:
Note:
Vertical alignment is only available in the Section Settings and is not available in Block Settings.
