flex-basis

The flex-basis CSS property sets the initial main size of a flex item. It sets the size of the content box unless otherwise set with box-sizing.

Note: It is recommended to use the flex shorthand with a keyword value like auto or initial instead of setting flex-basis on its own. The keyword values expand to reliable combinations of flex-grow, flex-shrink, and flex-basis, which help to achieve the commonly desired flex behaviors.

In this example, the flex-grow and flex-shrink properties are both set to 1 on all three items, indicating that the flex item can grow and shrink from the initial flex-basis.

Syntax example: flex-basis: 10em;