‫Hey, there, welcome back.
‫Let us continue our journey with our current profiling card.
‫So let me try to drag it here.
‫We can work with all defiance files.
‫OK, this looks fine.
‫Now the next thing I'm going to do is if you see I have all the content on some simple things that I
‫can do is just add a border, add something like this.
‫But the thing is, let's walk with S..
‫The first thing I'm going to do is Andy Cohen corner back here because I think now you have information.
‫What a rough section we are working.
‫For temporary purposes, this white collar that will be easy for you to recognize, but I think now
‫it's good time for you to understand how we are going to walk.
‫So, OK, now we can visualize the problem that we are going to face.
‫The first problem is about the.
‫So I'm going to select the font color, just jump onto body and I'm going to change default color for
‫everything.
‫Why?
‫Because this is the only text that we are going to walk.
‫So it's better for me to change her accent.
‫So I just select color hair on her.
‫Let me try to use white for now.
‫Save this one.
‫Get back here.
‫OK, much better.
‫But I want something light so that you can jump and use the exact color that you want.
‫Since I have already selected it so I can directly either test.
‫Save the Swan.
‫OK, so this is the exact color.
‫There are fewer things that you will realize that OK in the font is pretty different how we are going
‫to control that.
‫So don't worry, we are going to utilize Google Fonts.
‫We are not going to realize the direction which our default with our current browser or our current
‫code.
‫We are going to try this without Google.
‫Font will be doing that a bit later.
‫But for now, let's work with this section.
‫So the first thing I want is I want this image to be at the center.
‫And also, this will be at the top here.
‫What I can do is simply select the image, do some center things, and that should be fine.
‫It's not that simple.
‫I can jump if you remember the concept of whole in line and block.
‫So this is in line again.
‫The image is also in line.
‫That means to move it at the center, either I have to select their position and do that, or what I
‫can do is I can convert this into a block and then centric.
‫That will be much, much better.
‫So what I can do is select my image and then convert it into a block so that I can use display.
‫And by default, it's in line for image and had I can use block.
‫Now it's a new block and you can see now I can say, OK, Martin left and margin light as auto.
‫That means port side margin will be equal.
‫Audiovisual beard center.
‫So suppose here I say margin as auto on.
‫If I get back here, you can see other images are this enter?
‫We can convert this into our entire block.
‫And then I added equal space on or decide it's working fine.
‫Now I need to do something with this pro.
‫This law is not following the online thing or anything else.
‫Now, first thing is, this pro doesn't looks normal to me.
‫What we can do is we can use absolute and then decided its position from top and from the left itself.
‫Since this is inside a container, it will depend on a patent or top and bottom so we can add it here.
‫So what I'm going to do is I'm going to give it a name.
‫So here, let me jump on to my spine and I'm going to call this class as proof.
‫And now inside my personal.
‫I can select this room.
‫And then I can do whatever I want.
‫The first thing I want to do is I want to add a background Colorado corn cutter and do the normal things.
‫So here I'm going to select background color, jump hair.
‫Selective background color that you want.
‫OK, this looks much better.
‫The next thing is, I want to change the text color, so definitely I'm going to utilize the dark coercion.
‫Once that is done.
‫We need the hard border, we need to take up our position and also change the font size, so the best
‫thing I can do is question the font size had.
‫On site, let me take one point six and save this one.
‫This looks too big.
‫Let me try to use one point for him.
‫Much better.
‫OK, now we need to give it correct position, actually, the current position is not the right one
‫for this photo.
‫So what I can do is I can utilize position absolute.
‫Remember, this is, you know, zero zero zero.
‫So I can give dolphin and everything.
‫That means values also quick revision here position absolute depends on ancestor or DPD, which currently
‫have opposition property.
‫Remember, we are looking for the nearest ancestor.
‫In our case, if you observe our Dziedzic beta, which is the bill and currently this debate, don't
‫hold any type of position property.
‫And if you observe our section.
‫Yes, currently, the section holds opposition position, property of absolute.
‫So that means if we pass any type of value related to top, bottom left and right along with Z Index,
‫it will depend on this whole section.
‫I hope you remember the concept of position.
‫So her top should be one and then left should be one of them.
‫This looks fine to me.
‫Get back here.
‫OK, this is too small.
‫It may try to zoom a bit.
‫You can say it's too small.
‫What I can use is 1.5 here and two here.
‫To be honest, I have more idea about these room because I've already designed something similar.
‫I know the exact points here, so I just try to use different values so you get experience.
‫This is much better.
‫Now I also need to add certain padding there so that I pro as much veteran champ.
‫What I'm going to do is add some padding for top as well as for the excesses as well as the y axis.
‫So what I'm going to do is regard padding here and I'm going cross-legged 0.4 one then.
‫And also I'm going to select 0.5 RAM.
‫This is going to be for top and bottom.
‫This is going to be four left and right.
‫Save this one.
‫OK.
‫This is much better now.
‫Let me add some more space.
‫0.7 REM.
‫OK, perfect.
‫The only thing is, I think we need to add water.
‫Everything is fine.
‫So what I can do is I can simply add water here.
‫Let me add water.
‫It should be one fix.
‫Then I'm working on solid and then I'm going to use exact same color for background.
‫And once that is done, I can simply add a border radius.
‫And this time this is going to be zero going to them saying this one.
‫OK, this looks much better for this part, has done this whole part is done.
‫We need to add certain spacing in all the other things, but this part looks much better now.
‫The first thing I want to do is just to make this whole thing look better is the first thing is prove
‫are formed and also to our basic setting.
‫Like I need to add a bar that I know had I need to add some border radius to make it like this.
‫Add some padding here and change the color.
‫So let's do this to task in the next lecture.
‫In this lecture, we just completed the pro part and just had a better format in the next lecture.
‫Let us do something more.
‫I hope you are understanding about this whole thing in the next election.
‫Let us continue that.