When you set an element's
position
to fixed
,
the element stays at the same position
even when you scroll away.
The top
,
right
, bottom
,
and
left
properties are
used to position the element relative to
the browser window itself:
Change the position from fixed
to absolute
and then scroll
again to notice the difference
between these two position values.
We can make any changes to the parent
element's position. It wouldn't affect
the child element which is now fixed
:
Like we said in the start,
a fixed
element is positioned
in relation to the browser window.
But if you wanted to be more precise,
you'd say it is positioned relative to
the window viewport. It would be sensible for you to read a
bit more about it.