What's the difference between a relative, fixed, absolute and statically positioned element? (Cont...)

• relative - The element's position is adjusted relative to itself, without changing layout (and thus leaving a gap for the element where it would have been had it not been positioned).

What's the difference between a relative, fixed, absolute and statically positioned element? (Cont...)

• absolute - The element is removed from the flow of the page and positioned at a specified position relative to its closest positioned ancestor if any, or otherwise relative to the initial containing block.
  
  Absolutely positioned boxes can have margins, and they do not collapse with any other margins.
  These elements do not affect the position of other elements.

What's the difference between a relative, fixed, absolute and statically positioned element? (Cont...)

• fixed - The element is removed from the flow of the page and positioned at a specified position relative to the viewport and doesn't move when scrolled.

• sticky - Sticky positioning is a hybrid of relative and fixed positioning. The element is treated as relative positioned until it crosses a specified threshold, at which point it is treated as fixed positioned.