From the course: CSS: Variables and Fluid Layouts

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Create a starting CSS for the grid system

Create a starting CSS for the grid system - CSS Tutorial

From the course: CSS: Variables and Fluid Layouts

Start my 1-month free trial

Create a starting CSS for the grid system

- [Instructor] Now that we have our HTML all marked up with our wrapper and rows and our columns, let's go ahead and start writing some Flexbox for a desktop-based layout. So first of all, I'm going to start by putting in some colors here for col one. Let's put in a background color of a lovely shade of pale yellow. And then for col two, I'll put in a nice purple. For col three, I'll put in this blue here. And then for col four, there we go, so we'll put in this nice purple here for col four. So there we go. We've just put in some background colors so that we can see what we're doing. Anytime you're working with layout problems like this, putting in some borders, putting in some background colors is always super helpful and if you pick ugly colors like I did, well, you won't forget to take them out when you decide to put this code into production. So that's the whole purpose of those colors there. And now…

Contents