Så hva skjer med rutenett? Jeg mener Flexbox er her . Det er klart, nettleserne er (mer eller mindre) klare. Det er på tide. Vi kan vertikalt og horisontalt sentrere alt uten CSS transformere hacks!

I tillegg er det alt som andre ting Flexbox kan gjøre. La oss ikke snille oss selv. Vi har ventet på den sentrerende tingen i lang tid.

Kanskje du har sett den strålende Hva Flexbox ?! , serie, og du er klar til å gå. Hvis du ikke har sett det, bør du.

Så ... er vi dørrettingssystemer nå? Vel, på mange måter, kunne vi. Spesielt hvis du hater klassesuppe så mye som jeg gjør. Imidlertid er Flexbox-baserte grid-systemer allerede en ting, og de kan fortsatt være nyttige.

For eksempel kan de hjelpe deg med å holde fast i en CSS-metodikk som Objektorientert CSS eller BEM . Kanskje du bare liker å bruke klassene. Eller kanskje du bare blir vant til Flexbox, og å ha det gamle tolv-kolonne rutenettet vil hjelpe deg med å tilpasse.

Kanskje det er bare raskere å bruke et forhåndsdefinert system enn å tilpasse kode for hvert Flexbox-nett som du trenger.

Uansett årsakene går ikke gridsystemer unna; og du kan ha det beste fra begge verdener. Så hvorfor burde du ikke?

De "store to"

Jeg ville være remiss hvis jeg ikke nevnte det Foundaton 6 er ute, og det har en Flexbox-versjon av rutenettet som et alternativ. Ditto er ennå ikke tilgjengelig Bootstrap 4 .

De holder de gamle nettene rundt for folk som trenger å støtte mindre kompatible nettlesere, men de er klare til å skifte bryteren.

Flexbox Grid

Dette tilstrekkelig navngitte rutenettet holder til dere olde tolv søyler. Den har all kjennskap til 960.gs, alle Flexboxs avanserte oppsettegenskaper, samt de responsive klare klassene (ekstra små, små, mellomstore og store) som vi har kommet til å forvente.

Løst av Flexbox

Løst av Flexbox ble i utgangspunktet laget som en demo. Likevel er det en ganske komplett og funksjonell demo som kan brukes som grunnlag for mange et prosjekt.

Gridlex

Gridlex lever opp til sitt slagord, "Bare et Flexbox Grid System". Det er ikke mye å skille det fra Flexbox Grid. Velg den med de bedre klassenavnene, antar jeg.

sGrid

sGrid er litt annerledes. Spesielt er den bygget med Stylus. Jeg vet, ikke sant? Trodde vi alle brukte bare SASS nå. Uansett er den også designet for å bli integrert med en rekke andre teknologier: Meteor, Grunt, React, og NPM.

scss-flex-grid & sass-flex-mixin

Å det går vi. SCSS-flex-gitter og sass-flex-mixin er to separate SASS-baserte Flexbox-nett. Du kan klone enten fra deres depot eller installere scss-flex-grid via NPM.

Konklusjon

Verktøyene er der ute. Så langt har jeg ikke vært i stand til å identifisere en "fan-favoritt". Sjansen er, folk vil bare bruke det som kommer med deres favoritt CSS-rammer, for det meste.

I alle fall er det lite unnskyld lenger å ikke sette seg fast i Flexbox.