The placement of child boxes within the same parent box is determined by three rules: direction, alignment, and distribution.

Direction

You can choose the direction of boxes to line up from four directions.

You can also set the box to fold over by selecting the z-shaped arrow.

Alignment

Child elements can be left-, right-, center-, or stretch-aligned according to the box's direction.

* When you select stretch-align, child elements with width set to auto will automatically take up the entire width of the parent box, which is useful when you want to justify the width of a list item, for example.

Distribution

It allows you to set the distribution of the box's direction of travel. In addition to backward, middle and frontward alignments, you can also set equal distribution.

Did this answer your question?