1
00:00:01,860 --> 00:00:09,160
Now, the thing I want to show you with the individual item in a grid is that we can do something like

2
00:00:09,160 --> 00:00:10,030
Justify.

3
00:00:11,330 --> 00:00:19,760
Self, remember, up here, we did justify items and a line items, but when it comes to individual

4
00:00:19,760 --> 00:00:21,380
items, we have to use self.

5
00:00:22,070 --> 00:00:26,900
And as you can imagine, if I do self start and I refresh here.

6
00:00:28,080 --> 00:00:30,280
We go to the start of the column.

7
00:00:31,110 --> 00:00:33,330
If I do a line.

8
00:00:34,920 --> 00:00:43,890
It's going to go to the start of the row, and if we do end and refresh again, we see that the same

9
00:00:43,890 --> 00:00:45,030
thing is happening.

10
00:00:46,220 --> 00:00:50,010
I'm going to leave this file for you as well so you can play around with it.

11
00:00:50,540 --> 00:00:57,230
I encourage you to try to create different types of grids and looks that you want.

12
00:00:57,230 --> 00:01:03,770
As you can see, it's pretty powerful, but also very, very simple and allows us to create responsive

13
00:01:04,250 --> 00:01:06,300
grid systems very, very easily.

14
00:01:06,980 --> 00:01:12,050
Now, there's actually a cheat sheet that you can use to summarize everything that I've taught you up

15
00:01:12,050 --> 00:01:14,800
until now that I linked to in this video.

16
00:01:15,590 --> 00:01:18,620
It's called the well, the grid cheat sheet.

17
00:01:19,400 --> 00:01:22,670
And it shows you exactly why you need to do for the container.

18
00:01:23,650 --> 00:01:29,020
We've learned about grid gap, grid templates, a line items.

19
00:01:30,060 --> 00:01:36,540
And also, what to do with the children, such as grid column justify self aligned self, and it has

20
00:01:36,540 --> 00:01:40,500
all these little snippets that you can just click on and copy.

21
00:01:41,600 --> 00:01:49,160
So I recommend you play around with some of these properties on your own, because in the next part

22
00:01:49,310 --> 00:01:53,150
we're going to use CSFs Grid to build a complete website layout.

23
00:01:54,100 --> 00:01:54,850
I'll see in that one.