CSS Grid Changes Everything

TL;DW Natywne wsparcie grid layoutu przez CSS jest już obecne we wszystkich przeglądarkach, stąd nie ma potrzeby by używać Flexboxa, czy grid layoutu z frameworków - wystarczy, samo CSS.

[zychu69]

Wszystko fajnie, ale nie nadaje się to raczej do większych projektów gdzie wymagane jest większe wsparcie niż deklarowane tutaj:
http://caniuse.com/css-grid/embed

chociażby nie jest wspierany na iOS < 10.3, mobilnej operze i starszych safari.

W dzisiejszych czasach i tak większość korzysta z PostCSS (prekompilator) więc dla przykładu z użyciem LostGrid można zawrzeć kilka atrybutów w jednej linice typu:

[deathcoder]

@zychu69: Mobilnej Operze? Obejrzałeś film do końca? Robisz stronę pod wersję mobilna, czyli blok pod blokiem (mało prawdopodobne by było inaczej) i dokładnie w momencie w którym jest ok uzyskujesz bazę, która będzie dobrze wyglądała również na Operze mini. Potem na tej bazie robisz dodatkowego cssa pod duże ekrany.

Funkcja calc nie ma tu znaczenia, bo grid tez możesz ustalać w procentach. Zobacz

https://www.w3schools.com/code/tryit.asp?filename=FIBQ51TXNJPI (kliknij

[koziolek666]

ale nie nadaje się to raczej do większych projektów gdzie wymagane jest większe wsparcie niż deklarowane tutaj:

@zychu69: ale obejrzyj do końca. Tam jest opisany prawidłowe podejście do tego tematu. Najpierw robisz tak by było dobrze na urządzeniach mobilnych i traktujesz taką wersję jako podstawową. Następnie dodajesz @supports i wprowadzasz grid.
Pytanie co w takim wypadku z elementami, które strukturyzują, a chcemy się ich pozbyć? W takim przypadku CSS dla

[nie_daje_rady]

W końcu! W końcu jest dostępne coś co przypomina łatwością obsługi rysowanie na kartce lub jak kto woli JGoodies Formslayout!

[czlowiek_z_lisciem_na_glowie]

W porównaniu z Bootstrapem ten CSS grid to zabawka.

[DevChain]

Cóż, takie wsparcie że użytkownicy Windows 7 nadal używają IE8 i IE9, które to wspierane nie jest :) kwestia tego w jaki target celujemy

[masztan]

Wsparcie wcale nie jest tak zajebiste. Flexbox tez nadal gdzieniegdzie trzeba uzupelniac z prefiksami choc ma wieksze wsparcie.

[ddk1910]

Podrzucam mój tutorial do CSS Grida, gdzie między innymi porównuję CSS Grida z Bootstrapem :)
CSS Grid poradnik

[RobotKuchenny9000]

Co do flexa to dość fajnie bulma go organizuje pod budowanie layoutu, ale zgadzam się z komentarzami wyżej że flex ogólnie się do tego średnio nadaje.

[Domin1992]

Wygląda to ekstra, w następnym projekcie muszę się tym pobawić :)