Welcome to this course on CSS grid! The approach we're going to take with this course is, instead of simply looking at each one of the CSS grid rules and how you can use it. I wanted to take a little bit of a different approach.

In this guide we're going to get started on building out this page and we're going to be using a number of different technologies in order to do it

Now that we have our basic layout in place it's time to start getting into the basics of our CSS grid in our very first grid we're going to use multiple grid containers on this page.

In the last guide we built out our initial grid container. We still have some work that we need to get done on it. So let's start on that in this guide. First and foremost we need to take our container and move it inside of our text container or I should say our master content container.

In the last few guides we built out our first CSS grid container and hopefully you saw how intuitive it is to be able to create concepts such as columns and place them right inside of our layouts like we did right here.

Now that we have our second grid container live, what we're going to do is implement styles inside of here.

Great job in working through the project so far. Hopefully, this can be our last guide and we can get in all of these style definitions to build out our last component here on the page.

In the last guide we built out a repeating container with grid. And this is something that is very critical and I want to review it just a little bit before we get into finishing out the application the reason is because this is going to be something that you're going to have to do for many different applications.

In this guide we're going to take our CSS grid page our branding guidelines page and we are going to make it responsive so that works great on mobile phones and we're going to see how we can leverage media queries combine that with updated calls to CSS grid in order to implement that.