Introducing containers
Containers are the way Elementor now organizes and lays out webpages, replacing the current system of sections, columns, and inner sections. Containers not only allow you to create more complex web page designs, they also help you design your page layout more efficiently.
A container holds, or ‘contains’ the other elements of your page including Elementor widgets and other containers. When you place containers inside other containers they are called ‘nested’ or ‘child’ containers.
There are two types of containers; Grid containers are created with a symmetrical layout of rows and columns while Flexbox containers are created with asymmetrical layouts.
Why containers?
Elementor Flexbox Containers provide you with much greater creative freedom and control over your web design process. They also allow you to work more efficiently.
Better web page performance
Containers increase web page performance because they only contain one wrapper element: the container. This is in contrast with sections and columns which have two wrapper elements. Adding containers reduces the DOM (Document Object Model) size. This reduced object framework can, if properly implemented, improve your web page performance.
Greater freedom in designing
By nesting a child container inside a parent container, you’ll have better control over the direction, alignment, order, length, and placement of Elementor’s widgets. As an added bonus, you don’t need to add any additional sections or columns.
Flexible website design
Containers give you flexibility to reorder web page elements, making them easier to adjust to different screen sizes. Using containers, you can make sure the elements of your page appear in the proper order no matter what the screen size – resulting in a much better user experience.
Reusability of webpage elements
Containers can also greatly improve your workflow by giving you flexibility to reuse elements. You can create a container with several elements, save it, and reuse it as a recurring template.
Final words
Going forward, containers will allow us to introduce more exciting and powerful features, which are currently under development. As a next step, you’ll need to learn how to create containers.
To get the most out of Elementor, also check out the Elementor Academy for more helpful learning resources. If you come across any issues or need help, please contact our Support Center.