Cherishing the benefits of grid layouts
The entire book has so far been about grids – how we can use CSS Grid to create them, configure their finest details, design them, and use them to our advantage. We know that grids work. We’ve seen them countless times. We take this as a fact. But why? What are the reasons for this unreasonable effectiveness of grids on the web?
Let’s look at some of the main advantages of grid layouts to understand why they’ve become a staple of web design.
The ease of design and development
A grid can be simple or complex, but it can always be described with a few variables. Usually, we see a certain number of columns with a given total width. Sometimes, we also see descriptions of rows, usually with a given height. Elements can span one or more columns and one or more rows.
For example, imagine that we want to implement a grid, with a maximum total width of 960px
and with six possible columns. The main content should...