position relative vs position absolute code example

Example 1: what are the types of positioning in css

The types of positioning in CSS are-
1)static: this is the default value.
2)sticky: the element is positioned based on the user's scroll position.
3)fixed: the element is positioned related to the browser window.
4)relative: the element is positioned relative to its normal position.
5)absolute: the element is positioned absolutely to its first positioned parent.

Example 2: position relative and absolute difference in css

<div class=”parent”> <div class=”box” id=”one”>One</div> <div class=”box” id=”two”>Two</div> <div class=”box” id=”three”>Three</div> <div class=”box” id=”four”>Four</div></div>