Des items flexibles de tailles différentes

Les items sont en flex:1, sauf le deuxième qui est en flex:2 et le quatrième qui est en flex:4.

On voit que la largeur du contenu de chaque item est proportionnelle au nombre indiqué :

• 1
• 2
• 3
• 4
• 5

Autre exemple avec les mêmes valeurs mais plus de contenu :

• Premier
• C'est mon deuxième item qui est vraiment long
• Troisième
• C'est mon quatrième item
• Cinquième

Attention, on retrouve les mêmes pièges que quand tous les items sont en flex:1 : il n'y a pas de garantie de proportionnalité dans toutes les situations, à cause des paddings et bordures, et du contenu. Explications ici