In the second part of this screencast series, we will see how we can use the grid-template-areas to define the general cell tiles of the layout. Also, by using the grid-area we will place each component in its corresponding grid cell.
Stay tuned as the next week I will publish two new episodes from this series.
- Part 1 – Introduction
- Part 2 – Defining the named template areas in a CSS Grid
- Part 3 – Setting the rows and columns sizes in a CSS grid
- Part 4 – Centering items in CSS grid and using flexbox
- Part 5 – Responsive design with CSS grid
- Part 6 – Leave an empty cell and naming cells in a CSS grid layout
Also, you can check the other screencast series about Build a game with React part 1 and my full video course about React on Skillshare.
📖 50 Javascript, React and NextJs Projects
Learn by doing with this FREE ebook! Not sure what to build? Dive in with 50 projects with project briefs and wireframes! Choose from 8 project categories and get started right away.
📖 50 Javascript, React and NextJs Projects
Learn by doing with this FREE ebook! Not sure what to build? Dive in with 50 projects with project briefs and wireframes! Choose from 8 project categories and get started right away.