This list of CSS Grid Layout was inspired by Awesome Grid Layout by Simone Amorim.
There are many well documented CSS Grid learning resources (eg. grid by example – by Rachel Andrew, lab by Jen Simmons, CSS Grid layout – MDN Web Doc). The following work-in-progress list includes interesting posts picked from my daily internet dig for my own personal use. The posts/articles included in this list is based on my own personal interest that I am interested in learning or wanted to have handy for future reference.
Production Sites
- Rebuilding slack.com – by Mina Markham (medium.com)
- Grid Examples – a collection of sites using CSS Grid Layout and maintain by Silo Creativo.
- CSS Grid in Production – A collection of websites that have implemented CSS Grid Layout in production. Maintained by Rachel Andrew.
Learning Guides
- Prototyping with CSS grid – by Alex Lillo (Medium.com)
- A Complete Guide to CSS Grid – by Hui Jing Chen (codrops.com)
- Common Responsive Layouts with CSS Grid (and some without!) – Jo Franchetti (medium.com)
- Faux Grid Tracks – Eric Myer (alistapart.com)
- The CoffeeCup Guide to CSS Grid – cssgrid.cc
- Debugging CSS Grid Layouts With Firefox Grid Inspector – Chen Hui jing (smashingmagazine.com)
- Using Media Queries For Responsive Design In 2018 – Rachel Andrew (smashingmagazine.com)
- Teaching CSS grid to newcomers – Chen Hui jing (chenhuijing.com)
- How I design with CSS grid – Chen Hui jing (chenhuijing.com)
- Styling Empty Cells With Generated Content And CSS Grid Layout – Rachel Andrew (smashingmagazine.com)
- Lesser known CSS quirks & advanced tips – by Peedu Tuisk (medium.com).
- How display: contents; Works – by Ire Aderinokun (bitsofcode.com)
- A Collection of Interesting Facts about CSS Grid Layout – by Manuel Matuzovic (css-tricks)
- Another Collection of Interesting Facts About CSS Grid – by Manuel Matuzovic (css-tricks)
- Getting Started With CSS Layout – Rachel Andrew (smashingmagazine.com
WordPress Themes
- Mor10 (Kuhn theme) – mor10.com
- Khesara – A minimalist single column with postformat
Other Resources
- An Ultimate Collection of CSS Grid – by Ryan Yu (medium.com)
- CSS Grid: Book Mark for Learning – by Artem Deikun (medium.com)
- How Big Is That Box? Understanding Sizing In CSS Layout – by Rachel Andrew (smashingmagazine.com)
Interesting Posts
- From Bootstrap to CSS Grid – Natalya (medium.com)