+ 1
can anyone tell position:relative in css in a easy manner
2 Answers
+ 2
Positioned modes cannot really be explained "in a easy manner".
However, I will try to give you some key elements:
"relative" nor "absolute" values are what we could expect...
"relative" position the element relatively: NOT to itself, but its parent (container), and keep the initial space where the element would be stand if not positioned.
"absolute" position is not really absolute but relative to the nearest positioned ancestor, or the root element (think at it as either the "viewport", the window, the <html> element or the <body> one). And conversely to "relative" value remove the element from "normal" content stream (WITHOUT keeping the space wich would be kept by the element if it wasn't positioned).
Common use case, is to choose a reference container in the ancestors of a targeted element to place as layer above the document, set "position" of reference to "relative", without moving it, and "absolute" to target
We could now move (and size) it, through "left", "top", "right" and "bottom" properties.