Slowly
The builderBlocks

Div

The general-purpose grouping block for arranging elements inside other blocks.

A div is the workhorse grouping block. You reach for it to wrap a handful of elements inside a section, column, or slide, so you can lay them out and style them as a unit.

It carries no special behaviour of its own. It is a flex or grid box you fill and arrange, which is exactly what makes it the block you use most.

Adding one

  1. Select the section or container to hold it.
  2. Open the inserter and search "div".
  3. Pick the Div block, then add your content inside it.

Styling

The div uses the shared design panel for layout, spacing, colour, background, borders, and effects, each per breakpoint. Its hover and other states are where you set transitions or appearance changes triggered by the pointer or focus.

Accessibility

By default, a div renders as a plain div element, which carries no implicit role for assistive technology. When the div acts as a meaningful landmark, a navigation region, a complementary sidebar, a form, change its HTML tag in the layout settings to the matching semantic element (nav, aside, form, and so on). Screen readers and keyboard users rely on those landmarks to navigate a page efficiently.

On this page