A Div block is a versatile and powerful component that serves a wide range of purposes on a webpage. 

Common Uses

• Group Content: Bundle multiple components together for easier management and collective styling
• Create Dividers: Add visual separation between sections or distinct content areas
• Create Space: Use Div blocks to introduce spacing where margins alone aren’t enough

Add a Div Block

From the Element Island

The fastest way to insert a Div block is directly from the Element Island, letting you stay focused on the editor without unnecessary navigation.

From the Insert Panel

You can also add a Div block through the Insert Panel by following these simple steps:

1. Open the Kirki editor and navigate to the Insert Panel
2. Head over to the Elements block and find the Base Element
3. Locate the Div block, then drag and drop it onto your editor

📝 Note: If you can’t find the Base Element, go to Main Menu → View and toggle Show Base Elements.

Use the Keyboard Shortcut

To streamline your workflow even further, press the ‘F’ key – short for Frame – to let the editor know you are inserting a Div block. Draw the frame, and you’re good to go.