CSS Units

CSS has several different units for expressing a length. They are used to set lengths, paddings, margins, align elements and so on.

Absolute Lengths

The following are all absolute length units, they are not relative to anything else, and are generally considered to always be the same size.

UnitName
cmCentimeters   1cm = 96px/2.54
mmMillimeters    1mm = 1/10th of 1cm
QQuarter-millimeters    1Q = 1/40th of 1cm
pxPixels   1px = 1/96th of 1in
pcPicas    1pc = 1/6th of 1in
ptPoints    1pt = 1/72th of 1in
inInches   1in = 2.54cm = 96px

Relative Lengths

Relative units are useful for styling responsive sites because they scale relative to the parent or window size (depending on the unit).

UnitRelative to
emRelative to the font-size of the element (2em means 2 times the size of the current font)
exx-height of the element’s font.
chThe advance measure (width) of the glyph “0” of the element’s font.
remThe font size of the root element.
lhThe line height of the element.
vw1% of the viewport’s width.
vh1% of the viewport’s height.
vmin1% of the viewport’s smaller dimension.
vmax1% of the viewport’s larger dimension.
%Relative to the parent element

Browser Support

Length Unitchrome honar systemsedge honar systemsfire fox honar systemssafari honar systemsopera honar systems
em, ex, %, px, cm, mm, in, pt, pc1.03.01.01.03.5
ch27.09.01.07.020.0
rem4.09.03.64.111.6
vh vw20.09.019.06.020.0
vmin20.012.019.06.020.0
vmax26.016.019.07.020.0