CSS3 FLEXBOX

css-flexbox
Parmi les bonnes résolutions de ce début d’année, il me semblait intéressant d’approfondir mes lectures sur le module Flexbox, car Flexbox est un module, pas une propriété, cela entraîne pas mal de conséquences, entre autres que Flexbox a des propriétés bien à lui.
Je ne vais pas faire ici une démonstration des derniers aboutissements et des opportunités de FLEXBOX, d’autres sites sont des références en la matière. Juste faire le constat que l’utilisation de Flexbox que je gardais pour traiter des problématiques d’affichages mobiles, peut désormais être déployé de manière plus large pour les résolutions Desktop. Par expérience, je suis toujours prudent sur le déploiement de nouvelles spécifications, mais il convient d’avancer, lire les statistiques sur les navigateurs les plus usités et leur implémentation sur les fonctionnalités CSS, fort heureusement les parcs machines évoluent dans le bon sens. L’omniprésence des mobiles jouent aussi un rôle prépondérant dans l’utilisation de navigateur « responsive friendly »

Une lecture sur les spécifications et la mise en pratique aide aussi à ce faire une meilleure idée sur la mise en oeuvre de Flexbox qui est plutôt adapté aux composants d’une application, de petite échelle. Mais je vois déjà fleurirent des templates qui proposent une grille en full Flexbox alors que pour des mises en page complexes il existe CSS Grid Layout : un autre système de layout basé sur les grilles bien mieux étudié et qui changera durablement notre façon de travailler. Pour ma part je motiverais l’utilisation de Flexbox uniquement a l’affichage des modules tel que défini par SMACSS, pour les connaisseurs.

Le travail sur Bootstrap 4 en version alpha annonce également l’avènement et le déploiement en production de manière généralisé de Flexbox, c’est un premier pas pour nous faciliter la vie vers l’habillage, notamment sur les problèmes pour n’en citer que quelques uns : du centrage sur une verticale ou de définir l’ordre des éléments inclus dans une conteneur. Ceci dit même si ce module apparaît comme une martingale à nos problématiques d’affichage, il faut bien comprendre cette spécification et l’idée qui est à la base du positionnement flex.

Enfin pour finir, pour ceux qui veulent s’y mettre les lectures sont pléthores sur le sujet et les exemples nombreux, mais je ne saurais trop conseiller l’ouvrage de Raphael Goetter « CSS 3 FLEXBOX Plongez dans les CSS modernes » chez Eyrolles. L’ouvrage existe au format numérique forcément moins cher (c’est important).
Un petit pense bête est également un bon compagnon de route : A lire ici
livre Flexbox



Laissez un commentaire