The divider is a horizontal line that you can use to make a visual separation between two elements. In this article, we show you how to add a divider to your page and style it the way you want.
💡 Want to set default styling for your dividers? You can do this in the brand settings.
In this article
How to add a divider to your page
Go to the elements tab and drag and drop a divider onto your page.
💡When you're working with the Content Builder, it's not possible to add a divider to your page. They're included in some block templates.
Style dividers in the brand settings
In the brand settings, you can set the standard styling for the dividers in your content. Click brand and scroll to the bottom to apply this. If you want to edit the divider on a specific page, you can edit it manually within a specific element.
Element settings
Hover over the divider and click the cogwheel icon to open up the element settings panel. Here you have five options to style your divider, which we will briefly touch on below.
-
General settings - In this tab, you can set the divider color and the thickness.
-
Shadow - You can add a shadow to almost every element. Choose a Shadow color from the color picker and select Horizontal position and Vertical position. With the Blur radius, you can soften and fade the shadow.
-
Spacing - Spacing can be increased to create more space between the element's border and the content within the element.
-
Alignment - With this option, you can change the Horizontal alignment of the content within the element. The content can be aligned Left, Center, or Right.
-
Animation - From the drop-down menu, you can select the Entrance animation of the element. This animation will appear once when the page is opened. If you want the animation to appear more than once, you can edit the block settings to customize it accordingly.