« We want Flex, Flex for fantasy »

css3-flexbox

J’ai eu le plaisir de recevoir dernièrement le livre « CSS 3 Flexbox, Plongez dans les CSS modernes » publié chez Eyrolles. Un ouvrage entier sur une seule propriété ? Et oui, Raphaël Goetter a choisi de consacrer près de 130 pages (en couleurs, s’il vous plait) à une seule propriété CSS, à savoir, Flexbox. Il faut dire qu’il y a matière, car les specs sont complexes et les possibilités infinies (et au-delà) !

Le grand intérêt de Flexbox ? Ce qui le rend incontournable, c’est sa capacité innée à s’intégrer dans une logique « responsive ». Cerises sur le gâteau, les opérations telles que : l’alignement, le centrage vertical, la fluidité, les hauteurs identiques, la modification de l’ordre d’affichage des élément, etc. sont facilitées et accessibles au plus grand nombre, sans prise de tête (quoique).

La compatibilité avec le parc des navigateurs ? Elle semble excellente : plus de 95% des navigateurs utilisés en France (et au-delà) sont compatibles avec Flexbox (si l’on n’oublie pas les préfixes qui vont bien pour certains) ; et plus de 81% sont compatibles sans préfixe. Et gageons que ça ira en allant mieux.

Comment ça marche ? Il suffit qu’un élément soit transformé en flex-item (son parent est dans un contexte Flexbox) pour qu’iil change de statut : ni block ni inline, il devient alors possible de lui appliquer des propriétés spécifiques, telles que : order, align-self, flex-grow, flex-shrink, flex-basis, et flex qui est un raccourci pour les trois dernières propriétés cités.

Pour tester ? Rien de plus simple, deux Codepen sont disponibles : Livre Flexbox pour des démonstrations basiques et Jack in the flexbox pour aller plus loin.

Vous voulez en savoir plus ? C’est simple, il suffit de vous procurer le livre CSS 3 Flexbox et de vous caler dans votre siège baquet pour foncer vers de nouvelles aventure avec Flexbox ! En attendant d’être livré par drone, vous pourrez patienter avec l’article CSS3 Flexbox Layout module. Pour les plus impatients, voici la présentation du livre par Raphaël Goetter lui-même.

PS : on me souffle dans l’oreillette que les plus jeunes de mes lecteurs ne connaissent peut-être pas Billy Idol… Sur ce :