Using Css Grid in Web Design Basic Things to Know How to Use.

Making it easier to design web pages without having to use floats and positioning. for 2d dimension its good idea to use css grid for creating layout for your web pages. display: grid;
grid-template-columns: 250px 250px 250px 250px;
grid-template-rows: 250px 250px;
row-gap: 10px;
column-gap: 30px;

Second Type with 1fr unit to auto adjust your column and rows display: grid;
/*grid-template-columns:1fr 1fr 1fr 1fr;*/
grid-template-columns: repeat(4, 1fr);
column-gap: 20px;
grid-template-rows: 1fr 1fr;
row-gap: 30px;
height: 400px;

Arranging Grid Items in Columns and Rows -> .el--3 {
grid-column: 1/2;
grid-row: 2/3

}