Answer
Relative and absolute positioning use different layout rules. • A relatively positioned box keeps its normal-flow space and is visually offset. • An absolutely positioned box is taken out of normal flow. • An absolute box is positioned against its containing block.
💡 Simple Example
.card { position: relative; }
.badge { position: absolute; inset: .5rem .5rem auto auto; }
⚡ Quick Revision
Relative keeps flow space; absolute positioning removes the box from normal flow.