October 2018
Intermediate to advanced
116 pages
1h 23m
English
book
CSS Grid Layout: 5 Practical Projects
by Craig Buckler, Ilya Bodrov-Krukowski, Giulio Mainardi, Ahmed Bouchefra, Diego Souza
Content preview from CSS Grid Layout: 5 Practical Projects
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
Start your free trial
Chapter 4: Progressively Enhanced CSS Layouts from Floats to Flexbox to Grid
by Diogo Souza
It can be difficult to achieve complex, yet flexible and responsive grid layouts. Various techniques have evolved over the years but most, such as faux columns, were hacks rather than robust design options.
Most of these hacks were built on top of CSS float property. When flexbox layout module was introduced to the list of display property options, a new world of options became possible. Now you can not only define the direction the container is going to stack the items but also wrap, align (items and lines), order, shrink, etc. them in a container.
With all that power in hands, developers started to create their own combinations of rules for all sorts ...