Faster Layouts with CSS Grid (and Subgrid!)
CSS Grid has been available in most major browsers since early 2017, and it makes web layout more powerful than ever before. But complex-looking new syntax (line-names! grid-areas! minmax! fit-content! fr units!) and missing IE11 support can make it scary to many developers.
Don’t let that stop you: CSS Grid has made my layout process faster and simpler, with more flexibility. We can get started with a few basics, and the fallbacks don’t have to be overwhelming:
With Subgrid, we can also start to lay out nested elements on a shared grid, great for card layouts:
as well as common form patterns:
Miriam is a co-founder at OddBird, with 15 years experience as a project manager, user-experience designer, and front-end developer. She’s a member of the Sass core team, staff writer for CSS Tricks, and creator of popular open-source tools like Susy, True, and Herman. Miriam is also a musician with Teacup Gorilla, a published novelist & playwright, and a featured speaker at conferences around the world.
If you liked Faster Layouts with CSS Grid (and Subgrid!) by Miriam Suzanne Then you'll love Web Design Agency Miami
Related Posts
About The Author
