ColorElement positioning

unités de mesure

valeurs <length>

Valeurs absolues ou fixées, et valeurs relatives.

valeurs absolues
  1. in:inches
  2. cm:centimètres
  3. mm:millimètres
  4. pt:points
  5. pc:picas
valeurs relatives
  1. em:ems
  2. ex:exes
  3. px:pixels (tricky)
  4. gd:grids (CSS3 pour typographie est-asiatique)
  5. rem:root ems
  6. vw:viewport width (css3)
  7. vh:viewport height (css3)
  8. vm:viewport minimum (css3)
  9. ch:character

Pixels : on pourrait les penser comme unités absolues, mais en réalité avec le pixel-ratio, ça ne l'est pas !

Ems : quand utilisé avec font-size, 1em équivaut à la taille par défaut pour le device, par ex 16px souvent sur un navigateur sur desktop. Taille basée sur l'élément parent.

/!\ si utilisé sur autre chose que font-size, égal à la taille typo de l'élément, ex :

selecteur {
  font-size: 2em; // Ici font-size:2em = 2*16px = 32px si taille ref 16px.
  margin-bottom:1em; // = 1*32px ! basé sur le font-size !!
}

Ex: ex est basé sur le x-height d'une typo. Rem: les rems sont commes les ems, mais seront toujours relatifs au “root unit” (body, html) et non à l'élément parent.

%:calculé sur l'élément parent.