Aké sú možnosti umiestnenia prvkov v CSS?

V CSS-ju obstaja več možnosti za pozicioniranje elementov:

• static — privzeto pozicioniranje. Elementi so razporejeni v toku dokumenta, brez premikov.
• relative — element je pozicioniran glede na svojo običajno pozicijo. Lahko ga premikate z uporabo top, left, bottom, right, pri čemer zaseda mesto v toku.
• absolute — element je pozicioniran glede na najbližjega prednika z drugačno od static pozicijo (ali glede na okno, če takšnega ni). Element je izločen iz toka.
• fixed — element je fiksiran glede na okno brskalnika in se med pomikanjem ne premika. Prav tako je izločen iz toka.
• sticky — element se obnaša kot relative, dokler ne doseže določene pozicije med pomikanjem, potem pa kot fixed.

Poleg pozicioniranja se pogosto uporabljajo:

• Flexbox — prilagodljiv model za poravnavo in razporeditev prostora med elementi v eni dimenziji (vrstica ali stolpec).
• Grid — dvodimenzionalni mrežni model za razporeditev elementov po vrsticah in stolpcih.
• float — zastareli način za obkrožanje elementov, prej uporabljan za ustvarjanje stolpcev, danes redkejši.

Primer uporabe position:

.element {
  position: absolute;
  top: 10px;
  left: 20px;
}