Kāda ir atšķirība starp dažādiem elementu…

static - Noklusējuma pozīcija. Elements tiek pozicionēts saskaņā ar dokumenta standarta plūsmu. top, right, bottom, left īpašības neietekmē.
relative - Elements tiek pozicionēts relatīvi pret savu normālo pozīciju plūsmā. top, right, bottom, left īpašības to pārvieto no sākotnējās pozīcijas, bet aizņemtais vieta plūsmā paliek.
absolute - Elements pilnībā tiek noņemts no normālās dokumenta plūsmas. Tā pozīcija tiek noteikta ar top, right, bottom, left īpašībām attiecībā uz tuvāko pozicionēto vecāku (ar position: relative, absolute, fixed vai sticky). Ja tādu vecāku nav, pozīcija tiek noteikta attiecībā uz sākotnējo <html> bloku.
fixed - Elements pilnībā tiek noņemts no normālās dokumenta plūsmas. Tā pozīcija tiek noteikta ar top, right, bottom, left īpašībām attiecībā uz skatlogu (viewport). Elements paliek vietā, ritinot lapu.
sticky - Elements tiek pozicionēts kā relative, līdz brīdim, kad ritināšanas laikā tas sasniedz norādīto pozīciju (top, right, bottom, left), pēc tam tā pozīcija kļūst par fixed.

Atšķirību tabula:

Īpašība	`static`	`relative`	`absolute`	`fixed`	`sticky`
Dokumenta plūsma	Parasta	Saglabājas	Noņemts	Noņemts	Sākumā parasts, pēc tam noņemts
Pārvietojums (`top` utt.)	Nē	Attiecīgi pret sevi	Attiecīgi pret vecāku/vērošanas logu	Attiecīgi pret skatlogu	Attiecīgi pret sevi, pēc tam skatlogu
Ritināšanas laikā	Ritina	Ritina	Paliek vietā (ja vecāks `fixed`) vai ritina kopā ar vecāku	Paliek vietā	Sākumā ritina, pēc tam paliek vietā

Piemērs:

.static-box {
  position: static; /* Noklusējuma pozīcija */
  width: 100px;
  height: 100px;
  background-color: lightblue;
}

.relative-box {
  position: relative;
  top: 20px; /* Pārvietojums uz augšu no parastās pozīcijas */
  left: 20px; /* Pārvietojums uz labo pusi no parastās pozīcijas */
  width: 100px;
  height: 100px;
  background-color: lightgreen;
}

.absolute-container {
  position: relative; /* Vecāks, kas pozicionēts */
  width: 300px;
  height: 300px;
  border: 1px solid black;
}

.absolute-box {
  position: absolute;
  top: 50px; /* Attiecībā uz konteineru */
  left: 50px; /* Attiecībā uz konteineru */
  width: 50px;
  height: 50px;
  background-color: lightcoral;
}

.fixed-box {
  position: fixed;
  bottom: 10px; /* Attiecībā uz skatlogu */
  right: 10px; /* Attiecībā uz skatlogu */
  width: 70px;
  height: 70px;
  background-color: lightsalmon;
}

.sticky-header {
  position: sticky;
  top: 0; /* Pielīp pie skatloga augšas */
  height: 50px;
  background-color: lightgoldenrodyellow;
  z-index: 10; /* Pārklāj citus elementus, kad pielīp */
}

Kāda ir atšķirība starp dažādiem elementu pozicionēšanas veidiem CSS?