home javascript html Css React Redux Git Hub jira My self programs Sass


Postions properties :

Relative Position:
Setting the top, right, bottom, and left properties of an element with position: relative; property will cause it to adjust from its normal position. The other objects or elements will not fill the gap.
Syntax:
position: relative;

Absolute Position:
An element with position: absolute; will cause it to adjust its position with respect to its parent. If no parent is present, then it uses the document body as parent.
position: absolute;

Fixed Position:
Position: fixed; property applied to an element will cause it to always stay in the same place even if the page is scrolled. To position the element we use top, right, bottom, left properties.

Syntax: position: fixed;

Position :sticky
When we apply position sticky to an element, it also requires a threshold limit by setting value for at least one of the top, right, left, bottom properties.
When we scroll an element crosses to its threshold value, it becomes fixed.