Tak co se děje s mřížkovými systémy? Myslím, že tu je Flexbox. Je připraven, prohlížeče jsou (více či méně) připraveny. Už je čas. Můžeme vertikálně a horizontálně vycentrovat vše bez CSS transformace!

Navíc je tu vše, co Flexbox dokáže udělat. Ale neděláme si to. Čekali jsme na to, že jsme centrály po dlouhou dobu.

Možná jste sledovali brilantní Co Flexbox ?! , série a vy jste všichni připraveni jít. Pokud jste to neviděli, měli byste.

Takže ... teď už se nám vytahujeme mřížkové systémy? No, v mnoha ohledech jsme mohli. Zvláště když nenávidíš třídní polévku stejně jako já. Mřížkové systémy založené na Flexboxu jsou však již věcí a mohou být užitečné.

Mohli byste například pomoci držet metodiku CSS Objektově orientované CSS nebo BEM . Možná máte rádi používání tříd. Nebo možná právě zvyknete na Flexbox a pomůže vám přizpůsobit se staré dvanácti sloupcové mřížce.

Možná je to jen rychlejší použití předem definovaného systému než vlastní kódování každé mřížky Flexbox, kterou potřebujete.

Ať už jsou důvody jakékoli, systémy mřížky neodcházejí; a můžete mít to nejlepší z obou světů. Tak proč bys ne?

"Velké dva"

Byl bych vadný, kdybych o tom nezmínil Foundaton 6 je venku a jako volitelnou verzi má svou verzi mřížky Flexbox. K dosud nevydanému Bootstrap 4 .

Zachovávají staré mřížky kolem lidí, kteří potřebují podporovat méně vyhovující prohlížeče, ale jsou připraveni přepnout.

Flexbox Grid

Tento vhodně pojmenovaný systém mřížky udržuje se na dvanácti sloupcích. Má veškerou znalost modelu 960.gs, všechny pokročilé možnosti rozložení Flexboxu a třídy připravené pro citlivé reakce (mimořádně malé, malé, střední a velké), které jsme očekávali.

Řešeno společností Flexbox

Řešeno společností Flexbox byl v podstatě vytvořen jako demo. Přesto je to spíše kompletní a funkční ukázka, která může být použita jako základ pro mnoho projektů.

Gridlex

Gridlex žije až po jeho slogan "Jen systém Flexbox Grid". Není mnoho toho, aby to bylo možné rozlišovat od Flexbox Grid. Zvolte ten s lepšími názvy tříd, myslím.

sGrid

sGrid je trochu jiná. Konkrétně je vybudován s nástrojem Stylus. Já vím, že? Mysleli jsme, že jsme právě používali SASS. Navíc je navržena tak, aby byla integrována s řadou dalších technologií: Meteor, Grunt, React a NPM.

scss-flex-grid a sass-flex-mixin

Ach tam jdeme. scss-flex-grid a sass-flex-mixin jsou dvě oddělené sítě Flexboxu založené na SASS. Můžete klonovat buď z jejich repozitáře, nebo instalovat scss-flex-grid přes NPM.

Závěr

Nástroje jsou venku. Zatím jsem nebyl schopen identifikovat "fanoušek oblíbený". Je pravděpodobné, že lidé budou z větší části používat jen to, co přichází s jejich oblíbenými CSS rámci.

V každém případě je už trochu ospravedlnění, že se nezavrží do Flexboxu.