Test your knowledge: Flexbox

Review

1. What makes an element a flex container?

   The flex inner layout context is established by the flex display values.
2. What does `flex-direction` determine?

   The main axis is the direction chosen by flex-direction.
3. What is a flex base size?

   The base size can be changed by growth, shrinking, constraints, and freezing.
4. When a flex line has positive free space, what do grow factors do?

   Grow factors participate in positive free-space distribution.
5. When a flex line has negative free space, what do shrink factors help determine?

   Shrink factors participate when the flex line is too large for its available main size.
6. What is the three-component form of the flex shorthand?

   The shorthand represents flex-grow, flex-shrink, and flex-basis.
7. Why can two items with identical flex declarations finish at different sizes?

   Flex sizing is constrained by minimum and maximum sizes; freezing can change later distribution.
8. What does `flex-wrap: wrap` permit?

   Wrapping permits the flex layout to create additional lines.
9. Which module owns the shared alignment model used by Flexbox?

   Flexbox defines its application of the shared alignment model; Box Alignment owns the cross-layout alignment concepts.
10. What does `order` change?

    The property changes layout/painting order within the flex formatting context without rewriting the document tree.
11. How does an absolutely positioned child relate to ordinary flex-item layout?

    Positioned Layout owns the out-of-flow positioning model; the positioned child is not an ordinary flex item in the flex algorithm.
12. Which sequence is most useful when a flex item has an unexpected final size?

    Following the flex algorithm and its constraints is more reliable than changing unrelated presentation properties.