Cet utilitaire définit la taille initiale d'un élément flexible avant que l'espace restant ne soit distribué, contrôlant sa largeur ou hauteur dans le conteneur flex.
| Classe |
Styles |
| basis-<nombre> |
flex-basis: calc(var(--spacing) * <nombre>); |
| basis-<fraction> |
flex-basis: calc(<fraction> * 100%); |
| basis-full |
flex-basis: 100%; |
| basis-auto |
flex-basis: auto; |
| basis-3xs |
flex-basis: var(--container-3xs); /* 16rem (256px) */ |
| basis-2xs |
flex-basis: var(--container-2xs); /* 18rem (288px) */ |
| basis-xs |
flex-basis: var(--container-xs); /* 20rem (320px) */ |
| basis-sm |
flex-basis: var(--container-sm); /* 24rem (384px) */ |
| basis-md |
flex-basis: var(--container-md); /* 28rem (448px) */ |
| basis-lg |
flex-basis: var(--container-lg); /* 32rem (512px) */ |
| basis-xl |
flex-basis: var(--container-xl); /* 36rem (576px) */ |
| basis-2xl |
flex-basis: var(--container-2xl); /* 42rem (672px) */ |
| basis-3xl |
flex-basis: var(--container-3xl); /* 48rem (768px) */ |
| basis-4xl |
flex-basis: var(--container-4xl); /* 56rem (896px) */ |
| basis-5xl |
flex-basis: var(--container-5xl); /* 64rem (1024px) */ |
| basis-6xl |
flex-basis: var(--container-6xl); /* 72rem (1152px) */ |
| basis-7xl |
flex-basis: var(--container-7xl); /* 80rem (1280px) */ |
| basis-(<propriete-personnalisee>) |
flex-basis: var(<propriete-personnalisee>); |
| basis-[<valeur>] |
flex-basis: <valeur>; |