Exercise: Build a layout with Grid - CSS Tutorial

- [Speaker] In our previous codepen exercise, we got some practice building a basic grid layout. In this exercise, we're going to do the same, but take it a step further and create a 12-column grid system to lay out the page components. Let's update the CSS file path to grid CSS and open the file. (clicks loudly) The first thing we'll do is set up the dimensions. In the container block, add display grid to define this div as the grid container. (clicks loudly) Then we'll use grid template columns with the repeat function. (typing loudly) Inside the parentheses, let's set the first value to 12 for 12 columns, followed by a comma. For the size value, we'll use the minmax function. The space between the comma and the minmax isn't required, but I like to add it for readability. For the minmax value, we'll set the first value, which is the minimum to zero. When there's no content, an empty column will not be displayed.…