Grid, Containers, and Flexboxes: Editor 2.0 and Flex
Note: The information covered here applies to both Flex and Editor 2.0.
For a detailed breakdown of the difference between Flex, Editor 2.0, and the Classic editor, see this article.
There are three main areas to work within Flex: the Advanced Grid, Flex Columns, and Flexboxes. This article will discuss the differences between them, and when to use one instead of another.
As a general rule, if you want to create a freestyle composition with overlapping elements, use an Advanced Grid within a Flex Column. If you want to use an automatic layout that includes ordering items in a horizontal or vertical list, use a Flexbox.
Sometimes, there is no right or wrong answer, and there are several ways to achieve the same design goal. For example, when you have the same background (image/color/border) for a single object.
Advanced Grid
Advanced grids are best used for free-form compositions. Use advanced grids when you want to include non-linear compositions or overlapping objects.
Flex Column
Flexbox
Flexboxes can be added into flex columns and functions similar to columns by creating an automatic layout where items are ordered in a horizontal or vertical list. You can think of Flexboxes as "containers" to group specific elements within a given column, allowing those elements to be listed in a specific horizontal or vertical order within the flex column.
