What is css grid layout

The CSS grid layout module or simply known as Gruid or just guid is a two-dimensional grid-based layout system. With rows and columns, grid makes it is easier to design web page layouts, align and distruibute space among items in a grid.

Flexbox is great when we are dealing with 1 dimensional layouts. But when dealing with 2 dimensional layouts and you are concerned about laying down elements both horizontally and vertically CSS grid makes the task so much easier. Including the complex layouts that we typiclally tend to struggle. If you comfortable with HTML, CSS and flexbox, CSS grid is the logical next step for you.