by macando on 9/23/19, 5:38 PM
Outstanding. I learned the Flex layout by playing this simple game:
https://flexboxfroggy.com/ (from the same author I believe). I wonder if there are examples of learning through playing a game that are as effective as these two.
by dmix on 9/23/19, 6:33 PM
CSS Grid still blows my mind. A syntax that actually makes sense for a visual styling language in CSS?
People like to make fun of Javascript but CSS doesn't get enough heat. It was absolutely awful and still is in many ways.
Even Flexbox is a convoluted mess with a strange naming scheme.
CSS Grids just makes so much more sense intuitively for what it's trying to do.
by paul7986 on 9/23/19, 8:22 PM
I work in government which is pretty modern but there are users who still use Ie 11.
It looks like IE11 doesn't have full support for flex box or css garden..is that correct?
by sireat on 9/23/19, 9:27 PM
I am still amazed CSS Grid named areas are not used more often.
To me the named areas are the first time that CSS layout makes sense and I first did layouts in tables in the late 90s.
by jplayer01 on 9/23/19, 11:15 PM
Tried this and their froggy game a few months ago. I thought it was cool, but I felt it didn't translate well into the real-world. I still have significant issues figuring out how to do layouts in CSS and I still hate trying to do so.
by wilsmex on 9/23/19, 9:22 PM
I did a pretty popular comprehensive video tutorial on CSS grid:
https://www.youtube.com/watch?v=SPFDLHNm5KQBest 40 minutes you'll spend if you want to learn CSS Grid! :) First 5 mins are a bit of history, with grid starting at the 5 min. mark.
by lacampbell on 9/24/19, 4:12 AM
I learned flexbox since I thought... well you were supposed to. Should I have been using grid all along?
by jamesholden on 9/24/19, 6:48 AM
This is great! I know ZERO about CSS grid, but this taught me something and very straightforwardly.
by edem on 9/24/19, 10:03 AM
by chrisdew on 9/24/19, 7:53 AM
Great game, but does grid display use 1-based numbering?
by lsalvatore on 9/24/19, 12:24 AM
I created a CSS Grid course on Udemy at
https://www.udemy.com/css-grid-with-react/. My goal was to use it to build an Instagram web app clone. What I learned was that a lot of the features are really cool to play with but many lack practical use cases, its strong suit being its ability to go in both row and column directions. However despite trying I couldn't think of any use-case for configuring rows (going vertically). I found the grid-template-columns to be most useful, but the grid-area feels fairly gimmicky, as if you were building a quilt. Perhaps for a dashboard application. Overall, I just use flexbox now, even though CSS Grid has a cleaner API.