All right.
Welcome back.
In this video, let's talk about fixed positioning.
What is it?
Great.
Let's see.
Fixed position in behave as the absolute positioning but with one difference.
So let's see for this type of positioning, it position itself relative to the viewport or the browser
window itself.
So it doesn't take into consideration whether a parent has a position called relative or not.
It is always take or look up to the viewport.
The next point is that always the parent is a browser window or the viewport, as I said.
And lastly, regardless of how far or down the page you scroll, the element will always stay in the
same spot as we see in the final project.
And I use a position called Fix for this.
When I scroll, whatever I do, it doesn't take, it doesn't behave, it doesn't shake, it doesn't
move.
So I call this one as inanimate.
That's non living thing.
Good.
So let's see how we are going to implement that.
And you are going to continue from where we left because for this one is pretty easy to implement for
fixed positioning.
So let's get going.
So I'm going to add a different div inside this.
So let's add a dev with a class, say child three and let's see.
So let me come back to the CSS and copy one of these and then down here paste it and change this 1 to
3.
And let me remove the position here when I save it.
Let me change this one to purple color and let's see in the browser and here we go.
As soon as I add position called fix, now have it look fixed.
I could see automatically at his position down here because I have these properties, let me remove
the bottom left and right.
So as soon as I add the position fixed, I have these properties as before that is left, bottom, right
and top.
If I do that, you can see that where it is great.
But if I add top to zero and if you see where it position itself, when I say bottom zero, you can
see how it is position itself.
When I say left or right, zero to now see we see where it is.
That is the behaviour of fixed position in the next video.
Let's get started with our final project.