Alors, que se passe-t-il avec les systèmes de grille? Je veux dire que Flexbox est là . C'est prêt, les navigateurs sont (plus ou moins) prêts. Il est temps Nous pouvons centrer verticalement et horizontalement tout ce qui ne se transforme pas en CSS!
De plus, il y a tout ce que Flexbox peut faire d'autre. Ne nous leurrons pas, cependant. Nous attendons depuis longtemps ce centrage.
Peut-être que vous avez regardé le brillant Qu'est-ce que la Flexbox?! , série, et vous êtes tous prêts à partir. Si vous ne l'avez pas vu, vous devriez.
Alors ... sommes-nous en train d'amerrir les systèmes de grille maintenant? Eh bien, à bien des égards, nous avons pu. Surtout si vous détestez la soupe de classe autant que moi. Cependant, les systèmes de grille basés sur Flexbox sont déjà une chose, et ils peuvent toujours être utiles.
Par exemple, ils peuvent vous aider à suivre une méthodologie CSS comme CSS orienté objet ou BEM . Peut-être que vous aimez juste utiliser les classes. Ou peut-être que vous êtes juste en train de vous habituer à Flexbox, et avoir l'ancienne grille de douze colonnes vous aiderait à vous adapter.
Il est peut-être plus rapide d'utiliser un système prédéfini que de personnaliser chaque grille Flexbox dont vous avez besoin.
Quelles que soient les raisons, les systèmes de grille ne s’en vont pas; et vous pouvez avoir le meilleur des deux mondes. Alors pourquoi pas vous?
Je m'en voudrais de ne pas mentionner cela Foundaton 6 est sorti, et il a une version Flexbox de sa grille en option. Idem pour le futur Bootstrap 4 .
Ils conservent les anciennes grilles pour les personnes qui ont besoin de prendre en charge des navigateurs moins conformes, mais ils sont prêts à faire le changement.
Ce système de grille bien nommé garde à vous douze colonnes. Il a toute la familiarité de 960.gs, de toutes les fonctionnalités de mise en page avancées de Flexbox, ainsi que des classes adaptées aux besoins (très petites, petites, moyennes et grandes) auxquelles nous sommes habitués.
Résolu par Flexbox a été essentiellement conçu comme une démo. Pourtant, c'est une démo plutôt complète et fonctionnelle qui pourrait servir de base à de nombreux projets.
Gridlex est à la hauteur de son slogan, "juste un système de grille Flexbox". Il n'y a pas grand chose à différencier de Flexbox Grid. Choisissez celui avec les meilleurs noms de classe, je suppose.
sGrid est un peu différent Plus précisément, il est construit avec Stylus. N'est-ce pas? Je pensais que nous utilisions tous SASS maintenant. Quoi qu’il en soit, il est également conçu pour être intégré à plusieurs autres technologies: Meteor, Grunt, React et NPM.
Oh on y va scss-flex-grid et sass-flex-mixin sont deux grilles Flexbox distinctes basées sur SASS. Vous pouvez cloner à partir de leur référentiel ou installer scss-flex-grid via NPM.
Les outils sont là-bas. Jusqu'à présent, je n'ai pas été en mesure d'identifier un "favori des fans". Il y a de fortes chances que les utilisateurs utilisent pour la plupart ce qui vient avec leurs frameworks CSS préférés.
Dans tous les cas, il n'y a plus aucune excuse pour ne pas rester coincé dans Flexbox.