Can anyone help me in understanding position property?

Answer 1

There are five types of positions.

Static, absolute, relative, fixed, sticky.

elements are positioned static by default.

static always positioned according to the normal flow of the page.

static elements are not affected by the top,bottom,left and right.

relative element is positioned relative to its normal position.

position fixed element is always stays in the same position.

element with the position absolute is positioned relative to its nearest positioned ancestor.

An element with position: sticky; is positioned based on the user's scroll position.

sticky position is like the fixed navbar in the web site.

i hope this helpful to you.

Thanks!

Answer 2

The following links might help

https://developer.mozilla.org/en-US/docs/Web/CSS/position

https://css-tricks.com/almanac/properties/p/position/