Position example in CSS

CSS provides the following positionning models:

  • “static” is the default one.
  • “relative” indicate that element position is relative to itself. Also used as reference container for elements in absolute.
  • “absolute” forces position inside a container that is the first parent in relative positin, or the html element.
  • “fixed” means to position element in absolute position relative to browser view (the area displaying the page content).

You can find a basic example for this in the following codepen.