Co się dzieje z systemami gridowymi? Mam tu na myśli Flexboksa. Jest gotowy, przeglądarki są (mniej lub bardziej) gotowe. W samą porę. Możemy wertykalnie i poziomo wyśrodkować cokolwiek bez hackowania transformacji CSS!

Poza tym są jeszcze inne rzeczy, które może zrobić Flexbox. Ale nie oszukujmy się. Czekaliśmy na to centrowanie przez długi czas.

Może oglądałeś genialny Co to jest Flexbox ?! , seriale, i jesteś gotowy do pracy. Jeśli tego nie widziałeś, powinieneś.

Więc ... czy teraz rezygnujemy z systemów gridowych? Cóż, na wiele sposobów moglibyśmy. Zwłaszcza jeśli nienawidzisz klasowej zupy tak samo jak ja. Jednak systemy gridowe oparte na systemie Flexbox już są czymś i mogą być nadal przydatne.

Na przykład mogą pomóc ci trzymać się metodologii CSS, takiej jak CSS zorientowane na obiekt lub BEM . Może po prostu lubisz korzystać z zajęć. A może po prostu przyzwyczajasz się do Flexboksa, a posiadanie starej siatki z dwunastoma kolumnami pomoże ci się przystosować.

Być może po prostu szybciej jest użyć predefiniowanego systemu niż niestandardowego kodowania każdej siatki Flexbox, której potrzebujesz.

Bez względu na powody, systemy gridowe nie znikają; i możesz mieć to, co najlepsze z obu światów. Dlaczego więc nie powinieneś?

"Wielka dwójka"

Byłbym niedbały, gdybym o tym nie wspomniał Foundaton 6 jest wyłączony i ma opcjonalną wersję siatki Flexbox. Tak samo, jak jeszcze nie wydana Bootstrap 4 .

Zachowują stare sieci dla ludzi, którzy potrzebują obsługiwać mniej zgodne przeglądarki, ale są gotowi do zmiany.

Flexbox Grid

Ten trafnie nazwany system siatki trzyma dla ciebie starą dwanaście kolumn. Ma całą znajomość 960.gs, wszystkich zaawansowanych możliwości Flexboksa, a także gotowych do reakcji klas (ekstra małe, małe, średnie i duże), których możemy się spodziewać.

Rozwiązany przez Flexbox

Rozwiązany przez Flexbox w zasadzie powstał jako demo. Mimo to jest to raczej kompletne i funkcjonalne demo, które może być wykorzystane jako podstawa dla wielu projektów.

Gridlex

Gridlex jest zgodny z hasłem "Just a Flexbox Grid System". Nie ma zbyt wiele do odróżnienia go od Flexbox Grid. Wybierz chyba ten z lepszymi nazwami klas.

sGrid

sGrid jest trochę inny. W szczególności jest zbudowany z rysika. Wiem, prawda? Myślałem, że wszyscy używamy teraz SASS. W każdym razie jest również zaprojektowany do integracji z wieloma innymi technologiami: Meteor, Grunt, React i NPM.

scss-flex-grid i sass-flex-mixin

Och, idziemy. scss-flex-grid i sass-flex-mixin są dwie oddzielne sieci Flexbox oparte na SASS. Możesz klonować z ich repozytorium lub zainstalować scss-flex-grid za pośrednictwem NPM.

Wniosek

Narzędzia są tam. Do tej pory nie udało mi się zidentyfikować "ulubieńca fanów". Szanse są takie, że ludzie po prostu wykorzystają to, co pochodzi z ich ulubionymi frameworkami CSS, w przeważającej części.

W każdym razie nie ma już wymówki, aby nie utknąć w Flexboksie.