flex-basis

Last Updated: March 29, 2022

If you want to set the initial length for the flex item you can use the flex-basis property.

div{
  flex-basis: number|auto|initial|inherit;
}

number: You can put in the initial number and it is a length unit or percentage (e.g. 20%, 5rem, etc.).

flex-basis: auto; It looks at its own height and width

flex-basis: content; Size of the item is based on its content

In this example, all div have 90px width and 2nd div hasĀ flex-basis: 200px;

div:nth-of-type(2) {
  flex-basis: 100px;
}
1
2
3
Test