Dividers help organize page content and hierarchy into individual sections. You can add a horizontal divider using the Divider block or add a vertical divider by adding some CSS to your design.
Horizontal dividers
Select the Divider block from the blocks tab and drag it over to your design.
Once set, you can start working on how you want this divider to display. Click the divider block, and choose the Styles tab. Here, you can use the Horizontal Rule style to edit your divider:
Vertical dividers
While a vertical divider is not a block type, you can achieve this look by using a 1-pixel image as a background image element. This option won't display in Outlook PC because this email client doesn't support background images.
1. Create a 1x1 image filled with the desired color for the divider
2. In your design, click on a column block or other container block
3. Click on Styles
4. Click the Background Image element
5. Browser to the 1x1 image that was created earlier and upload it
6. Copy the contents of the Background Image field and append it to the end value, adding a comma as a separator
url("/nodeapp/test/file-fixtures/emails/tbe-template-fixture/black-1x1.png"),
url("/nodeapp/test/file-fixtures/emails/tbe-template-fixture/black-1x1.png")7. Set the value of the Background Repeat field to repeat-y
8. Set the value of the Background Position to 33.3% center, 66.6% center
The percentage values are the locations where the dividers will appear in the container block.