1 reply

The main axis in flex box

flex-grow

flex-grow

and

flex-shrink

flex-shrink

and

flex-basis

flex-basis

all work on the main axis, meaning that if you have 2 flex items and the

flex-direction: row;

flex-direction: row;

then the main axis is the horizontal one so the items are allowed to grow and shrink in that axis and if you set

flex-basis

flex-basis

of the flex items then it's equal to setting the

width

width

of them, but if your

flex-direction: column;

flex-direction: column;

then the growing and shrinking are happening in the vertical axis and setting the

flex-basis

flex-basis

is equal to setting the

height

height

, and *maybe this why we don't have

justify-content: stretch;

justify-content: stretch;

because if you want the items to stretch across the main axis you can just set the

flex-grow: 1;

flex-grow: 1;

---
Is this take right or am I missing something?