Elementor containers are the layout boxes that hold widgets and other containers. Each container uses Flexbox: set the direction (row for side by side, column for stacked), justify content (spacing along the direction), align items (spacing across it), gap between items and wrap. Nest containers inside each other to build any layout, and change direction on mobile so rows stack into columns.
- Containers replace old sections and columns.
- Direction row = side by side; column = stacked.
- Use gap instead of margins between items.
- Fewer nested containers keep pages fast.
- Switch direction per device for responsive layouts.
What do the Flexbox settings do?
| Setting | Effect |
|---|---|
| Direction | Row (horizontal) or column (vertical) |
| Justify content | Start, center, end, space between along the direction |
| Align items | Start, center, end, stretch across the direction |
| Gap | Space between children |
| Wrap | Let items flow to a new line |
| Content width | Boxed or full width |
How do you build a two-column hero?
- Add a container, direction row, content width boxed.
- Add two child containers, each 50% width.
- Left: heading, text and button, direction column, gap 20px.
- Right: image, align center.
- On mobile: parent direction column, children 100% width.
Live 1-to-1 WordPress and Elementor lessons on your own site, from $40. Every lesson recorded. Beginners welcome.
Why do containers make sites faster?
Imagine a page built with old sections, each holding columns, inner sections and more columns. The HTML becomes deeply nested and heavy. The same design with containers often needs far fewer elements, which reduces DOM size and improves speed. Next: the Elementor grid container.
Want to learn Elementor layouts faster with a tutor?
I teach WordPress and Elementor 1-to-1 over Zoom or Google Meet, on your own website, at your pace. Lessons start at $40, every lesson is recorded so you can rewatch it, and you get a short checklist afterwards. Beginners, business owners, students and freelancers are all welcome. See lessons and prices or book a free intro call.
Frequently asked questions
What are Elementor containers?
Layout boxes using Flexbox that hold widgets and other containers, replacing sections and columns.
How do I put two elements side by side in Elementor?
Set the parent container direction to row.
How do I stack columns on mobile?
Change the container direction to column in mobile responsive mode.
Are Elementor containers faster than sections?
Usually yes, because they need fewer nested elements.
Sources
Live 1-to-1 WordPress and Elementor lessons on your own site, from $40. Every lesson recorded. Beginners welcome.
More WordPress guides
Guide, 3 min readWordPress and Elementor Tutoring: Your Questions Answered
Guide, 3 min readWordPress Multisite Explained: Who Needs It (and Who Does Not)
Guide, 3 min readWordPress Comments and Spam: Settings That Keep Your Site Clean
Guide, 3 min readHow to Move WordPress to HTTPS (SSL) and Fix Mixed ContentRather have an expert run your WordPress site?
Tanvir H is a Bangladesh-based WordPress and Elementor web designer with 7+ years of experience, 650+ projects and a 4.9 client rating. New websites, redesigns, fixes, speed, security and SEO, handled by one expert who explains everything in plain English and works with clients worldwide.
