1
00:00:05,390 --> 00:00:14,840
After reviewing how to wrap reflects boxes just by using a simple function, let's see now a property

2
00:00:15,260 --> 00:00:24,530
able to manage boxes alignment and boxes spacing according to some commands given by it.

3
00:00:24,740 --> 00:00:27,890
This property is called justify content.

4
00:00:31,180 --> 00:00:40,390
The base value of justified content is Flagstad, and this way, if we turn up with this type of attribute

5
00:00:40,400 --> 00:00:45,610
within justified content, our flexible boxes will appear.

6
00:00:45,610 --> 00:00:53,410
Let's say normally the way they have been inserted, according to the commands given by the property,

7
00:00:53,410 --> 00:00:55,450
is present in the classes.

8
00:00:56,760 --> 00:00:58,950
With no particular indication.

9
00:01:00,090 --> 00:01:03,090
Apart from a simple row alignment.

10
00:01:05,280 --> 00:01:09,930
But if I circuit, for example, the flex and function.

11
00:01:12,580 --> 00:01:13,690
As you can see.

12
00:01:14,930 --> 00:01:18,200
The content would be right aligned.

13
00:01:19,300 --> 00:01:27,940
And would get up to the preset 400 pixel limit for every single class, which would obviously shrink

14
00:01:27,940 --> 00:01:32,800
by and by with the diminishing of the browser dimension.

15
00:01:35,070 --> 00:01:42,600
The peculiarity of this function is, as a matter of fact, the possibility through a simple attribute

16
00:01:42,660 --> 00:01:48,020
to align perfectly the content present within the container.

17
00:01:48,570 --> 00:01:49,720
From center.

18
00:01:50,430 --> 00:01:53,490
Let's see how within the browser.

19
00:01:55,200 --> 00:02:02,160
Simply by widening the page, our contents will get placed always at the center of eight.

20
00:02:03,530 --> 00:02:10,210
Therefore, if we try and enlarge it completely, the content will always be placed in the center.

21
00:02:13,750 --> 00:02:21,980
In addition to senator then inserting some spaces inside all our divides is possible.

22
00:02:22,750 --> 00:02:33,850
So if I inserted space between which is one of the other attributes we can insert into justify content

23
00:02:33,850 --> 00:02:39,820
by saving and refreshing, we would see that widening our browser.

24
00:02:41,600 --> 00:02:45,530
Some spaces will be inserted inside our Dave's.

25
00:02:46,860 --> 00:02:54,900
Therefore, they will remain always detached in the same way through some spaces, according to the

26
00:02:54,900 --> 00:02:56,380
length of the browser.

27
00:02:56,820 --> 00:03:00,810
The same thing can be obtained with space around.

28
00:03:06,280 --> 00:03:15,130
With the difference, though, that in this case, the spaces are inserted also on the left and on the

29
00:03:15,130 --> 00:03:24,250
right of the row, and so these centered alignment we obtain with this specific attribute is aided by

30
00:03:24,250 --> 00:03:30,280
this additional space placed at both sides of our child elements.

31
00:03:33,940 --> 00:03:36,790
In addition then to space around.

32
00:03:37,920 --> 00:03:42,630
We can choose to insert space evenly.

33
00:03:47,390 --> 00:03:48,020
Which.

34
00:03:49,090 --> 00:03:52,210
Introduces an equal space.

35
00:03:54,100 --> 00:04:00,730
As you can notice, both before and after, every single day of.

36
00:04:02,290 --> 00:04:12,190
To conclude, to perfectly align the contents in within a container, justify a content is the function

37
00:04:12,190 --> 00:04:13,330
you are looking for.