Resources for Learning How to Code Layouts

You got excited about the new possibilities for layout design. Now you want to try some things out. You want to learn the new CSS. Where should you start?

1) Rachel Andrew

You should get to know Rachel Andrew’s work. She’s been writing, presenting, demoing, and advocating for new layout technology for several years now. And she has a Giant Pile of Helpful.

  • Books by Rachel, including Get Ready for CSS Grid Layout
  • Rachel built an entire website of examples of Grid:
  • She’s presented at dozens of conferences, search for videos of her talks and watch the most recent ones for the most up-to-date information
  • Best of all, Rachel has made a video series for learning All the CSS for Layout, from floats to display:table, from Flexbox to Grid: The CSS Workshop. It’s a high-quality course that costs money to access. Meaning she gets paid, and you get an efficient way to really go deep with this stuff. It’s totally worth it, if you can afford the $200 for the whole course.
  • And check out her blog and website for more.

2) Flexbox Games

There are several games for learning Flexbox — or really, for learning the Alignment module. Doing some fun drills is a great way to master your memorization of the new lingo.

3) Dive In

Really, the best way to learn how to code CSS is to code some CSS. Download Firefox Nightly for the most-recent implementation of Grid. It will just work in Nightly, you don’t have to flip a flag.

4) Read the Specs

If you want to get to the Real Truth, the original source where everything else comes from, then read the CSS Grid specification, the Flexbox specification, and any of the many more.