Priority Support
Help Center > Elements > Divider element

Divider element

Last Update: August 24, 2025

This post has been translated using machine translation, which may result in minor inaccuracies or differences in wording compared to the original. We apologize for any errors or ambiguities. Please feel free to contact us if we can clarify anything for you.

Who can use this feature:
This article is for Editor v4 users. If you’re using Editor v3, check out the relevant article here: Button Widget

Add and delete the element

To access and use a widget:

  1. In Elementor Editor, click +.
    All available elements are displayed.

  2. Click or drag the element to the canvas. For more information, see Add elements to a page.

To delete the widget:

  1. On the canvas, select the element by clicking it.
  2. Press the delete key on your keyboard. For more information, see Delete elements from a page.

What is the Divider element?

The Divider element add. a horizontal line to your page to create a border between the page’s sections.

Common use case

Alex is building a website for the bit upcoming football game. They want to put a divider between the banner headline and an image of the stadium.

Add a Divider element: Step-by-step

  1. Create a banner headline at the top of the page.
  2. Drag a Divider element into the container below the heading.
    Note
    When you add the divider to the canvas, it will automatically create a container. Make sure the container settings are set to Column and Justify center. 

  3. The divider is a little too thin for this design. To thicken the line, open the Size section.
  4. Change the Height to 5 PX.
  5. Now let’s change the color of the divider. Open the Background section.
  6. Select a background color. For details, see Choose a color.
  7. Finally let’s add a border to the divider. Open the Border section.
  8. Click the plus sign by Border.
  9. You can adjust the thickness, color and type of border. In the example we’ll leave the default settings.

    The divider appears under the headline.

Settings for the Divider element

You can customize your elements using content and style, offering you great flexibility in tailoring them to your needs. Click the tabs below to see all the settings available for this element.

Allows you to tag individual elements on a page. This way you can link to this specific element.

Attributes are used by developers to target certain elements in order to customize them. Attributes and their uses are discussed in detail as part of Elementor’s developer documentation.

See the individual articles on Style options:

 

On this page

Share this article

Hosted with