Note: The number you supply for the flex value is simply a relative unit, not an absolute measure. In the top example, each flex-item is about 33% the width of the container. However, if one of those divs has a flex value of 2, then the widths change MDN.

Note: The flex-shrink controls how narrow a flex-item can be, or how much it can shrink, and it’s dependent upon flex-items having set widths. For more info visit MDN.

Note: You can think of the flex-basis value as a kind of minimum width for a flex-item.

Note: flex: flex-grow flex-shrink flex-basis