CSS has several different units for expressing a length.
Many CSS properties take "length" values, such as width, margin, padding, font-size, border-width, etc.
Length is a number followed by a length unit, such as 10px, 2em, etc.
A whitespace cannot appear between the number and the unit.
However,
if the value is 0, the unit can be omitted.
For some CSS properties, negative lengths are allowed.
There are two types of length units: relative and absolute.

You can use:

---

Relative length units:
Specify a length relative to another length property and scales better between different rendering mediums.

% - is the most widely used;
em - relative to the font-size of the element (2em means 2 times the size of the current font);
rem - relative to font-size of the root element;

ex - relative to the x-height of the current font (rarely used);
ch - relative to a width of the "0" (zero);
vw - relative to 1% of the width of the viewport*;
vh - relative to 1% of the height of the viewport*;
vmin - relative to 1% of viewport's* smaller dimension;
vmax - relative to 1% of viewport's* larger dimension;

---

Absolute Lengths:
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.
Units are fixed and a length expressed in any of these will appear as exactly that size.
px * - pixels (1px = 1/96th of 1in);

cm - centimeters;
mm - millimeters;
in - inches (1in = 96px = 2.54cm);
pt - points (1pt = 1/72 of 1in);
pc - picas (1pc = 12 pt);