Position: static ;

default

The element will remain in the natural flow of the page.

As a result, it will not act as anchor point for the absolutely positioned pink block.

Also, it will not react to the following properties:

• top
• bottom
• left
• right
• z-index

Position: relative ;

The element will remain in the natural flow of the page.

It also makes the element positioned: it will act as an anchor point for the absolutely positioned pink block.

Also, it will react to the following properties:

• top
• bottom
• left
• right
• z-index

Position: absolute ;

The element will not remain in the natural flow of the page. It will position itself according to the closest positioned ancestor.

Because it's positioned, it will act as an anchor point for the absolutely positioned pink block.

Also, it will react to the following properties:

• top
• bottom
• left
• right
• z-index

Position: fixed ;

The element will not remain in the natural flow of the page. It will position itself according to the viewport.

Because it's positioned, it will act as an anchor point for the absolutely positioned pink block.

Also, it will react to the following properties:

• top
• bottom
• left
• right
• z-index