Div Block element

Activate experimental feature

The XXXX widget is an experimental feature that XXX

In order to use XXX widget, you need to activate it. For details, see activating Elementor features.

Add and delete the element

Add the element to the canvas

To access and use a element:

In Elementor Editor, click +.
All available elements are displayed.
Click or drag the element to the canvas. For more information, see Add elements to a page.

Delete the element

To delete the widget:

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

What is the Div Block widget?

A Div Block is a generic container designed to hold other elements, including other Div Blocks. Div Blocks are similar to Flexbox containers, but are lighter and load faster. They are a great solution for simple designs.

See all the options available with the Div Block.

Common use case

Ellis is designing a home page for their new restaurant. They decide to use a simple, quick loading design for the hero section.

Example

Add a Div Block element - Step-by-step

Add a Div Block to the canvas. For details, see Add elements to a page.

The Div Block options appear in the panel.
Click the Style tab.
Open the Size field.
Set the Div Block to
1. Width: 1000 PX
2. Height: 500 PX
Open the Background section.
Add a background image.
For details, see Style tab – Background and Add a layered background.

Settings for the Div Block element

You can customize your elements using the General and Style tabs. These options offer you flexibility in tailoring elements to your needs. Click the tabs below to see all the settings available for this element.

Tag

Tag your Div Block according to the content inside. Tagging your block correctly helps search engines understand your site and can help SEO. Choose among the following HTML tag:

Div
Header
Section
Article
Aside
Footer

Link

Click the plus sign to enter a link. Visitors clicking the Div Block file will open the link.

Note

If you add a link to a Div Block, you cannot make any of the elements in the Div Block clickable.

If you add a link the following option appears:

Open in a new tab: If the Div Block contains a link, toggle on if you want the link to open in a new tab.

Style tab options

View the individual articles on Style options: