➢CSS has several different units for expressing a length.
➢Many CSS properties take "length" values, such as width, margin, padding, font-size, etc.
➢Length is a number followed by a length unit, such as 10px, 2em, etc.
Absolute Lengths
➢The absolute length units are fixed and a length expressed in any of these will appear as exactly that size.
➢Absolute length units are not recommended for use on screen, because screen sizes vary so much. However, they can be used if the output medium is known, such as for print layout.
Unit
Description
cm
centimeters
mm
millimeters
in
inches (1in = 96px = 2.54cm)
px *
pixels (1px = 1/96th of 1in)
pt
points (1pt = 1/72 of 1in)
pc
picas (1pc = 12 pt)
Relative Lengths
➢Relative length units specify a length relative to another length property. Relative length units scales better between different rendering mediums.
Unit
Description
em
Relative to the font-size of the element (2em means 2 times the size of the current font)
ex
Relative to the x-height of the current font (rarely used)