1
00:00:02,180 --> 00:00:05,640
Now to finish the look of this main page

2
00:00:05,640 --> 00:00:06,930
of our website,

3
00:00:06,930 --> 00:00:11,210
I now also want to give this whole page a background color

4
00:00:11,210 --> 00:00:14,180
and add a little bit more spacing,

5
00:00:14,180 --> 00:00:17,080
a little bit more distance at the top of this page

6
00:00:17,080 --> 00:00:18,423
above this image.

7
00:00:19,350 --> 00:00:20,183
And for this,

8
00:00:20,183 --> 00:00:23,840
we can go back to our CSS code and up there to the body role

9
00:00:23,840 --> 00:00:25,860
to this body selector,

10
00:00:25,860 --> 00:00:28,550
because I want to set a background color

11
00:00:28,550 --> 00:00:29,880
for the entire page.

12
00:00:29,880 --> 00:00:32,570
So not for any other nested element,

13
00:00:32,570 --> 00:00:35,050
but for the entire visible content

14
00:00:35,050 --> 00:00:38,170
and hence body as the right element to target.

15
00:00:38,170 --> 00:00:41,540
Since this holds all the visible content

16
00:00:41,540 --> 00:00:44,050
and for the spacing to the top,

17
00:00:44,050 --> 00:00:48,030
we can also use the body because this holds all the content,

18
00:00:48,030 --> 00:00:51,675
so that's a good place to also add some spacing

19
00:00:51,675 --> 00:00:53,830
around the content.

20
00:00:53,830 --> 00:00:57,390
So in daily challenge CSS in body,

21
00:00:57,390 --> 00:01:01,010
I'll set a background color and conveniently

22
00:01:01,010 --> 00:01:05,239
the CSS property for that is called background color.

23
00:01:05,239 --> 00:01:09,020
And I again create a color with RGB here

24
00:01:09,020 --> 00:01:12,020
and I'll use 233 for the red part,

25
00:01:12,020 --> 00:01:16,763
215 for the green and 207 for the blue part.

26
00:01:17,830 --> 00:01:21,910
And for the spacing, we have the margin property,

27
00:01:21,910 --> 00:01:26,080
which adds some spacing around the elements so to say.

28
00:01:26,080 --> 00:01:30,130
And here I'll set this to 50 pixels to add a margin.

29
00:01:30,130 --> 00:01:33,360
So a distance of 50 pixels to the top, bottom,

30
00:01:33,360 --> 00:01:35,130
left and right.

31
00:01:35,130 --> 00:01:37,480
We won't see it on bottom left and right,

32
00:01:37,480 --> 00:01:41,060
because we have no content to the left, right or bottom,

33
00:01:41,060 --> 00:01:43,750
but we do see it at the top if I reload

34
00:01:43,750 --> 00:01:46,790
and we also see the new background color,

35
00:01:46,790 --> 00:01:50,420
and that's now pretty much the finished first page

36
00:01:50,420 --> 00:01:53,620
of the site, but I'm saying first page,

37
00:01:53,620 --> 00:01:56,693
because I wanna have another page now.