1 00:00:00,880 --> 00:00:04,880 OK, guys, now we can work on that justified content. 2 00:00:05,200 --> 00:00:06,890 The first thing we will do right here. 3 00:00:07,150 --> 00:00:13,300 We can just copy the same of the where is it that line items? 4 00:00:14,080 --> 00:00:20,950 Copy it and we will work by the same way of the allied items. 5 00:00:21,370 --> 00:00:28,720 We can just we will change just this one and make it tough to find content like delete the text from 6 00:00:28,720 --> 00:00:29,100 here. 7 00:00:29,140 --> 00:00:30,040 We don't need it. 8 00:00:32,230 --> 00:00:35,880 OK, and we will keep the item a paid thing. 9 00:00:37,030 --> 00:00:38,410 And this will be a. 10 00:00:39,070 --> 00:00:40,660 We don't need to hide anymore. 11 00:00:41,750 --> 00:00:51,610 OK, after this party, we can go to the table, we can type Campell, we can call this one here. 12 00:00:52,960 --> 00:00:57,490 There's one to be for just Keerthi content. 13 00:00:59,740 --> 00:01:08,300 And then here we will connect between this file and the CFS title sheet. 14 00:01:08,920 --> 00:01:14,220 Each of justify that CFS. 15 00:01:16,150 --> 00:01:17,860 OK and it's right here. 16 00:01:18,100 --> 00:01:27,300 The first thing we will do is to type at On the Edge won't be having to define content and we will see 17 00:01:27,310 --> 00:01:29,440 what justified content we can start with. 18 00:01:29,680 --> 00:01:34,930 We can start with the center like what we have here. 19 00:01:35,110 --> 00:01:35,950 OK, great. 20 00:01:36,520 --> 00:01:39,580 And then after this part we can make Dev. 21 00:01:42,790 --> 00:01:54,100 With class of and then inside, it became again with class, up with class of item and I can pay and 22 00:01:54,100 --> 00:02:02,950 for the most part we can type inside edge to with a OK, everything is good and we can make Devora. 23 00:02:03,070 --> 00:02:11,320 I'm going to show you two ways to type classes and ideas inside the team and we can type the class. 24 00:02:11,320 --> 00:02:21,620 If having done that already is having cash, if I type jot item and dumped item B now we got this. 25 00:02:21,730 --> 00:02:31,150 What if I want to add an idea also we can make Jack with cache of item, class of item or class. 26 00:02:32,200 --> 00:02:36,340 So now we got this or there isn't another way, just type dot. 27 00:02:37,640 --> 00:02:42,610 Class and now we Galvis, and we can also use it for the identity 28 00:02:45,110 --> 00:02:51,830 and it's here, we can make HGP and then for the last one we can just copy and paste it. 29 00:02:52,970 --> 00:02:58,190 They just want to be seen the same. 30 00:02:59,260 --> 00:03:00,950 OK, so now we got this. 31 00:03:01,280 --> 00:03:06,250 Let's say that I want this text to be let's try to make that text center. 32 00:03:06,260 --> 00:03:08,030 I'm just want to show you something. 33 00:03:09,090 --> 00:03:17,720 Let's give this class all justify content so we can cover this class and and go to the title of Ethem. 34 00:03:19,890 --> 00:03:30,210 This one, let's say that we can't add the line three checks to line the center, but here we get no 35 00:03:30,210 --> 00:03:37,410 thanks because taking this with and not only with the screen, I want to move all of the text to be 36 00:03:37,410 --> 00:03:39,530 centered for the page. 37 00:03:39,900 --> 00:03:42,870 There is a property which is called justified. 38 00:03:42,870 --> 00:03:48,450 Content here would not justify content, pay line and have to buy content. 39 00:03:48,450 --> 00:03:55,460 And we will just try the center and space around space between eight spaced evenly. 40 00:03:56,100 --> 00:03:57,310 We can talk here. 41 00:03:57,380 --> 00:04:06,270 Justified Content Center and now we got this at the center, the old all of the box is centered, but 42 00:04:06,270 --> 00:04:08,820 the text itself is not centered. 43 00:04:09,480 --> 00:04:11,730 We can go here and we will know. 44 00:04:11,990 --> 00:04:15,690 We will know more about this one in our projects. 45 00:04:15,990 --> 00:04:19,240 This could we will use them in our project. 46 00:04:19,350 --> 00:04:20,340 The source code. 47 00:04:21,350 --> 00:04:22,740 We can cover this one. 48 00:04:23,930 --> 00:04:31,230 We can add a twant justify content for this one. 49 00:04:31,250 --> 00:04:41,750 We can try for justified content and pasting this one before and we can type here, justify content 50 00:04:41,750 --> 00:04:42,260 center. 51 00:04:42,260 --> 00:04:51,710 But instead of the center, we will make it and then here justified content to be and the start will 52 00:04:51,710 --> 00:04:52,780 be making those changes. 53 00:04:52,790 --> 00:04:58,450 We get also justified content start, but it's making more sense because we already have been in the 54 00:04:58,460 --> 00:04:59,930 start as a default 55 00:05:02,420 --> 00:05:03,760 saver to go here. 56 00:05:04,940 --> 00:05:06,530 What's the problem with this part? 57 00:05:06,530 --> 00:05:08,150 I think we get something wrong. 58 00:05:09,230 --> 00:05:12,050 We didn't say no. 59 00:05:12,050 --> 00:05:13,500 We got something with it's part. 60 00:05:13,510 --> 00:05:15,740 So what's the problem here? 61 00:05:18,020 --> 00:05:25,550 Justified content and, yes, justified content. 62 00:05:26,740 --> 00:05:36,610 Aflex and so the problem was with Aflex, sorry, and now after this part, we can try for the space 63 00:05:36,610 --> 00:05:41,440 between we can go here, Ghurayb any one. 64 00:05:43,490 --> 00:05:52,250 Just communist part and some space right here and space, there's one space for space between and this 65 00:05:52,250 --> 00:05:58,390 one to pick out the space between, we can copy this class and go to the seats right here. 66 00:06:00,020 --> 00:06:04,550 OK, just the content space between. 67 00:06:07,640 --> 00:06:14,840 When we save and go and reload now we got a spacing that equals distance from this part of this part 68 00:06:14,840 --> 00:06:22,580 and this part and this part, there's something also which which is called space around. 69 00:06:22,910 --> 00:06:25,460 We can create a new one right here. 70 00:06:26,180 --> 00:06:27,530 We can at a distance here. 71 00:06:28,130 --> 00:06:29,690 We can copy this code 72 00:06:32,600 --> 00:06:39,740 based and just want to be for space around this one to be fought around. 73 00:06:39,740 --> 00:06:45,320 And we can go now to justify content that we can copy this line. 74 00:06:45,360 --> 00:06:50,240 And here we are around and they want to be around. 75 00:06:52,030 --> 00:06:58,510 So now we got this around, we've got space here, space here, space here, but this space will be 76 00:06:58,510 --> 00:07:00,820 larger than this space. 77 00:07:00,850 --> 00:07:02,620 This is the difference when you move out here. 78 00:07:02,900 --> 00:07:03,970 It got the same. 79 00:07:05,530 --> 00:07:15,850 As you can see from here, this space is larger than this space, we can try now for the justified content 80 00:07:15,850 --> 00:07:18,880 evenly, which is the last one. 81 00:07:18,880 --> 00:07:21,990 We will try for that justify content. 82 00:07:22,570 --> 00:07:23,890 We can cover this part. 83 00:07:24,880 --> 00:07:36,120 OK, scroll down past this one before E randomly and this one to be for also the even link. 84 00:07:36,910 --> 00:07:43,690 And now we can go to this part of this class again. 85 00:07:43,820 --> 00:07:49,780 And this would be working only when we load up. 86 00:07:49,840 --> 00:07:51,130 What's the problem here? 87 00:07:52,360 --> 00:07:57,820 Space even we know we got something wrong with this part. 88 00:07:57,870 --> 00:08:00,370 So what's the problem here? 89 00:08:02,940 --> 00:08:12,300 Yes, that classmate family, so now we've got the space evenly spaced evenly, you would go the same 90 00:08:12,300 --> 00:08:12,810 distance. 91 00:08:13,020 --> 00:08:15,200 This will be equal to this one. 92 00:08:15,210 --> 00:08:15,930 This one. 93 00:08:15,930 --> 00:08:23,550 And that's what that's all about, that define content for the website we will create and our source 94 00:08:23,550 --> 00:08:28,260 code, the cease fire, which we will use to create our website. 95 00:08:28,590 --> 00:08:29,520 That's perfect. 96 00:08:29,730 --> 00:08:36,840 In the next video, we will be having an introduction to the media queries and how to make the website 97 00:08:36,840 --> 00:08:42,220 responsive because we will add some responsive design to the great system. 98 00:08:42,750 --> 00:08:44,750 So good luck and have fun.