<p>By default position is <strong>static.</strong></p>
<p>Static: No difference can be seen.</p>
<p><strong>Relative</strong>: Relative to its normal position. If top, left are present then the div will move according to the top and left value from its normal position.</p>
<p>A<strong>bsolute</strong>: The div will move with respect to its parent(parent can be its parent div and if not then body is the parent). Now div will not move with respect to its normal position.</p>
<p><strong>Sticky:</strong> It means the div is fixed at a particular position even if we scroll. It will not leave its original position.</p>
<p><strong>Fixed:</strong> It means div leaves its position and if another div is present next to it, that second div will take its position and the fixed div will come above the second div and is fixed at a particular position even if we scroll.</p>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://github.com/KashyapAnkur/namaste-frontend-interview">https://github.com/KashyapAnkur/namaste-frontend-interview</a></div>


By default position is **static.**

Static: No difference can be seen.

**Relative**: Relative to its normal position. If top, left are present then the div will move according to the top and left value from its normal position.

A**bsolute**: The div will move with respect to its parent(parent can be its parent div and if not then body is the parent). Now div will not move with respect to its normal position.

**Sticky:** It means the div is fixed at a particular position even if we scroll. It will not leave its original position.

**Fixed:** It means div leaves its position and if another div is present next to it, that second div will take its position and the fixed div will come above the second div and is fixed at a particular position even if we scroll.

%[https://github.com/KashyapAnkur/namaste-frontend-interview]

Absolute, Relative, Fixed and Sticky properties in CSS