Flexbox est un nouveau mode de mise en page (display) qui permet de disposer les éléments de manière plus flexible et de gérer de manière prévisible leur alignement quelque soit la taille de l'écran. Ce nouveau mode de disposition vient se positionner comme une amélioration du modèle block reposant sur les floats.
Liens utiles
Fonctionnement de base
Pour utiliser les flexbox il suffit de mettre un display:flex sur l'élément englobant plusieurs enfants. Les enfants directs se placeront alors les uns à côté des autres en essayant d'occuper tout l'espace disponible. Il est ensuite possible de piloter le comportement des enfants gràce à des propriétés comme flex-direction, flex-wrap, justify-content, etc...
Pour l'ensemble des propriétés disponibles je vous renvois vers cette page css-tricks.com qui résume très bien ces propriétés et leur effet sur les éléments en flex.
Compatibilité
Les flexbox sont supportées par tous les navigateur modernes sauf Internet Explorer (on commence à avoir l'habitude...)
- IE11 supporte assez bien les flexbox mais possède quelques bugs dans certains cas (cf caniuse.com)
