In this video, we're going to take care of our contacts section right here.
So let's go to our website and also go to text editor.
Now, this area is similar to the social section, sort of some of the comment of contact NAPP and then
scroll down a bit as we did up there.
We're going to create a section with an idea of contact and also a class of Porchetto.
Within our section, we're going to create a container, so it did with a glass of contact container.
And within this container, just going to include the icons, the icons are pretty much similar to the
icons that we had out here.
The only difference is that this time I'm going to the closing tag.
No, but seriously, the difference is that the class starts with the FAA less then f a end street view.
And then a dash to times and are a said two times to X and our class of Hober So asserts we do this,
we should have.
They do.
Now let's compare this three more times.
I'm going to place the first one right on the second one, hit the phone, then we have a male so precise
male and its bulk male Bulc.
And actually, that's it, we only have three icons then we did this, take a look at our first year,
we only had three.
Now, that's pretty much it for the e-mails.
We could start up in our sixth.
So let's start with a comment on that section, OK, and then if this we're going to target or contact
Heidi.
And we're going to start studying it by positioning it again as fixed, and this time we're going to
fix it to the right.
So right zero.
Got to display this fax.
And of course, the flex direction would be in a condo action, you're also going to line the items
to the center and we're going to have a mix width of 10 new portrait and a max height or just a height
of I.D. you put right now for the border radius.
It's a bit different this time.
We want our upper left corner to be 10 pixels or upper right corner to be zero pixels, then bottom
right corner zero pixels and the bottom left corner to be 10 pixels.
So let's take a look at this.
And hey, there we go.
Now, don't forget, we already have that border class, that shadow class within it.
Now for transition, we still need to use our three seconds and is.
Now, let's take the container, the class of contact and container.
And.
We'll display this as Fleck's.
The flex that option in the column and the items will be justified, not the items.
Oops, sorry about that.
Going to justify the content with space around.
So if we take a look in here.
Oh yeah.
So this is actually the perfect example.
This is the space that the container is taking up.
It's taking up only the necessary space.
So what we need to do is tell it to take up the entire space of its pound container, which is the idea
of contact.
Now, the Pentagon with ideal contact, has a viewport height of viewpoints, OK, right there.
So as soon as we tell this to have a height of one hundred percent of its pound container, then it
spreads out with 100 percent of the space that is within the container.
Only to do now is increase the letter spacing.
I actually give it the march or a margin of one room.
And there we go.
This should be perfect.
All right.
Now, I still want to do something, and that is the FAA s should have the same colors after as the
FAA piece, because if you take a look here, these are gray.
And if you hover over them, they would turn white.
And we need to do the same thing to our F.
S. So just cover feet, be changed the face and a they would go.
OK, so that's pretty much it for the context section.