Divi 5 relies on native CSS flexbox. The Wrapping Alignment option in Divi 5 controls how multiple wrapped elements are aligned along the vertical axis when the Layout Direction is set to Column or Column Reverse, and along the horizontal axis when the Layout Direction is set to Row or Row Reverse, inside a flex container with Layout Wrapping enabled.
Wrapping Alignment Location
You can find the Wrapping Alignment options in the Design Tab → Layout → Layout Wrapping by enabling either the Wrap or Wrap Reverse options of the following element types:
Section
Row
Column
Group module
Wrapping Alignment Purpose
When a container (such as a row or group) has wrapping enabled, items that don’t fit on one line wrap to the following line, the Wrapping Alignment option lets you choose how those multiple rows (or columns) of elements are positioned vertically (in a row layout) or horizontally (in a column layout).
Wrapping Alignment Usage
Use Wrapping Alignment when:
You enable wrapping because you have too many modules in a row or column.
You want control over how the wrapped lines are stacked in the container.
Wrapping Alignment → Stretch
Fills the container’s available space. Wrapped rows of items stretch to fill all available space.
Wrapping Alignment → Start
Lines up wrapped items at the start of the container (top or left, depending on direction).
Wrapping Alignment → Center
Centers all the wrapped lines inside the container.
Wrapping Alignment → End
Aligns wrapped items at the end of the container (bottom or right).
Wrapping Alignment → Space Between
The first and last rows are pushed to the edges, and the remaining rows are spaced evenly in between.
Wrapping Alignment → Space Around
Equal space is added around each wrapped line. So there’s space before the first and after the last.
Wrapping Alignment → Space Evenly
Equal space is distributed between and around all rows of wrapped items.
