Position-relative and absolute

1.Relative
When your are using position relative it relative to itself means relative will try to position itself according to it's current position.

So above image shows that suppose you have given a green box container position:relative top:20px this green box will moves it's current position.

2.Absolute
When you are using position absolute it will try to look first it's ancestor(parent) if we have defined the position relative over there(parent),so it position according to its ancestor.otherwise it will position according your browser or other dimensions.

Above images when u do green box position:absolute left:20px and in black container you have defined a position:relative so the green box will move its parent position or we can say its ancestor if parent doesn't defined position relative . then it will look browser dimensions.

ThankYou!😃
Keep learning new things.