Pozycja

Pozycja w CSS określa jak element jest ułożony na stronie internetowej. Właściwość position umożliwia określenie jak element jest umieszczany względem innych elementów i jak będzie się zachowywał podczas przewijania strony.

position: static element jest ustawiony w naturalny sposób w tekście i nie można go przesunąć

								
div {
  position: static;
}

Ten element <p> ma pozycję: statyczną

position: relative element jest ustawiony względem swojej pozycji naturalnej, ale można go przesunąć

								
div {
  position: relative;
  top: 20px;
  left: 10px;
}

Ten element <p> ma pozycję: relatywną

position: absolute element jest ustawiony względem pierwszego kontenera, który ma pozycję nie-statyczną (lub względem głównego kontenera, jeśli żaden inny nie jest ustawiony)

								
div {
  position: absolute;
  top: 60px;
  right: 10px;
  width: 250px;
  height: 80px;
}

Ten element <div> ma pozycję: absolutną

position: fixed element jest ustawiony względem okna przeglądarki i nie zmienia swojej pozycji podczas przewijania

								
div {
  position: fixed;
  bottom: 20px;
  left: 30px;
}

Ten element <p> ma pozycję: fixed