# Position

The position property is used to specify the type of positioning method used for an element. It determines how an element is positioned within a document, and it can affect the behavior of other elements as well.

There are five values of position: static, relative, absolute, fixed, and sticky.

1. `Static` (default value):

This sets the position of an element to its default, which means the element will flow into the page as it normally would, without any special positioning.

2. `Fixed`:

This sets the position of an element to a fixed position relative to the viewport, meaning it will remain in the same place even if the page is scrolled.

3. `Relative`:

This sets the position of an element relative to its default position, allowing you to offset it from that default position with `top`, `right`, `bottom`, and `left` properties.

4. `Absolute`:

This sets the position of an element relative to the nearest positioned ancestor element, or the viewport if there is no positioned ancestor.

5. `Sticky`:

This sets the position of an element to `fixed` within its parent container, but only after a certain threshold has been met. For example, an element with a `position: sticky` value will remain within its parent container until the user scrolls to a certain point, at which point it becomes `fixed` and stays in the same place on the screen as the user continues to scroll.