Building a layout with CSS Grid Setting rows columns sizes in CSS grid

Bite-sized screencasts and tips about React, CSS and Javascript. we will see the CSS grid auto-placement in action and how we can make a CSS layout to span the full height of the screen.

In the third lesson of this example, we will use the grid-template-columns and grid-template-rows to size the elements. Also, we will see the CSS grid auto-placement in action and how we can make a CSS layout to span the full height of the screen.

css css-grid video

Bite-sized screencasts and tips about React, CSS and Javascript. Below is the first part, describing the full example and the starting files. Drop me an email at daniel at js-craft.io with your feedback 🙂 Expect 1-2 videos per week

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.

Want to develop a website or re-design using CSS Development? We build a website and we implemented CSS successfully if you are planning to **[Hire CSS Developer](https://hourlydeveloper.io/hire-dedicated-css-developer/ "Hire CSS Developer")**...

The other day one of our students asked about possibility of having a CSS cheatsheet to help to decide on the best suited approach when doing this or that layout.

I've been chasing the idea of using (abusing?) CSS grid to build a interconnected hexagonal grid, where each hexagon fits together seamlessly.