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:
- Open the Kirki editor and navigate to the Insert Panel
- Head over to the Elements block and find the Base Element
- 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.