Kādi ir mērvienību CSS?

Absolūtie un relatīvie.

Tips	Vienība	Apraksts
Absolūtie	px	Pikseļi, atkarīgi no ekrāna izšķirtspējas.
	pt	Punkti, 1/72 collas.
	cm	Centimetri.
	mm	Milimetri.
	in	Collas, 1 colla = 2.54 cm.
	pc	Pikas, 1 pikas = 12 punktu.
Relatīvie	em	Attiecībā uz vecāka elementa fonta lielumu.
	rem	Attiecībā uz saknes (html) elementa fonta lielumu.
	vw	Attiecībā uz 1% skatlogu platuma.
	vh	Attiecībā uz 1% skatlogu augstuma.
	vmin	Attiecībā uz 1% mazākās skatlogu malas.
	vmax	Attiecībā uz 1% lielākās skatlogu malas.
	%	Attiecībā uz vecāka elementa (vai saturējošā bloka) lielumu.
	ch	Attiecībā uz pašreizējā fonta '0' rakstzīmes platumu.
	ex	Attiecībā uz pašreizējā fonta mazo burtu augstumu.

Izvēle ir atkarīga no konteksta: px bieži tiek izmantots robežām un rastra attēliem, rem un em — fontiem un atstarpēm, nodrošinot labāku mērogojamību dažādās ierīcēs. Procentuālas vērtības ir noderīgas atsaucīgai dizainam.

/* Piemērs lietošanai */
.container {
  width: 80%; /* Attiecībā uz vecāku */
  margin: 1rem auto; /* Attiecībā uz `html` fonta lielumu */
}

.box {
  padding: 20px; /* Absolūta vērtība */
  font-size: 1.2em; /* Attiecībā uz vecāka fonta lielumu */
  width: 50vw; /* Attiecībā uz skatlogu platumu */
}