Relative Lengths

Support Key: [CSS1|CSS2|CSS2.1] [IE3|N4B3|O3.5|S1]
Other Units
Absolute Length
URL
Color
Angle
Time
Frequency
= Index DOT Css by Brian Wilson =
Main Index | Property Index | CSS Support History | Browser History



What is it?
Relative length units describe physical dimensions relative to some other dynamic reference measure. This type of unit measure tends to scale better between different rendering mediums. A relative length consists of an optional sign character ("+"/"-"), followed by a number, followed immediately by a relative length unit. If the given length is zero, the sign character and unit measure are optional. Values that can not be supported by the rendering device should be mapped to the nearest value that CAN be supported.
Relative Length Units in CSS
em
[CSS1|CSS2|CSS2.1] [IE4B1|N4B3|O3.5|S1]
Description:
Ems. A scaling factor relative to the value of the current element's 'font-size' property. If 'em's are used in the 'font-size' property for an element, the scaling factor is relative to the value of the 'font-size' property of the parent element. If this type of unit is specified for the root element of a document, the scaling factor should be relative to the browser default value for the property.
ex
[CSS1|CSS2|CSS2.1] [IE4B2|N4B3|O3.5|S1]
Description:
X-height. A scaling factor relative to the height of the letter 'x' for a font (also known as the relationship of lowercase low-rise letters to high-rise characters.) If this type of unit is specified for the root element of a document, the scaling factor should be relative to the browser default value for the property.
px
[CSS1|CSS2|CSS2.1] [IE3|N4|O3.5|S1]
Description:
Pixels. The size of a pixel is dependent on the resolution of the rendering device. The CSS2 Recommendation advises a "reference pixel" scaling that should be used if the available resolution is significantly different than typical resolutions:
"It is recommended that the reference pixel be the visual angle of one pixel on a device with a pixel density of 90dpi and a distance from the reader of an arm's length. For a nominal arm's length of 28 inches, the visual angle is therefore about 0.0227 degrees."
Example
div { margin-top: 12px }
Browser Peculiarities

Boring Copyright Stuff....