I recently came across several CSS-Units I didn't know about. So I compiled a little list of all the currently available units.
Here a list of all size related CSS-Units for
px- Represents a pixel on the screen for devices around 96dpi or lower. For displays higher than 96dpi, one
pxdoesn't actually represent a single pixel, but
1 / 96of 1 inch.
1 / 4of a millimeter.
mm- One millimeter.
cm- One centimeter.
in- One inch (or 25.4mm).
pt- One point which equals
1 / 72of an inch.
pc- One pica which equals 12pt
emequals the elements font-size. If set on the
font-sizeproperty, it is calculated based on the inherited font-size.
rem- Like the
remunit is relative to the font-size, but instead of using the inherited font-size, it uses the font-size of the document (i.e. the
exequals the height of the small letter x, this is also called the x-height. For most fonts, this is close to
ch- The width of the number
1 / 100of the height of the viewport.
1 / 100of the width of the viewport.
1 / 100of the width or height of the viewport, whichever is smaller.
1 / 100of the width or height of the viewport, whichever is bigger.