font-size-adjust Description:
The font-size-adjust property allows you to make alternative fonts more legible by adjusting the ratio of their font size to their x-height. The higher this value is (in general) the more legible the font will be at smaller sizes.
font-size-adjust in CSS Versions:
font-size-adjust Syntax:
font-size-adjust: <number> | none | inherit
- number
the aspect value, usually of your first choice font. This is then applied to second choice fonts as a scaling factor using the following formula:y * (a/a') = c
- y = the font-size of your first choice font
- a = the aspect value or number in the font-size-adjust property
- a' = the aspect value of the available font
- c = the font-size to apply to the available font
- none
Do not preserve the font's x-height. - inherit
The element should have the same font-size-adjust setting as the parent.
font-size-adjust Initial Value:
none
font-size-adjust Applies To:
All elements.
font-size-adjust Inheritance:
This property is inherited.
font-size-adjust Browser Support:
None
font-size-adjust Examples:
If 14px Verdana (with an aspect value of 0.58) was unavailable and an available font had an aspect value of 0.46, the font-size of the substitute would be 14 * (0.58/0.46) = 17.65px. (from W3C)
font-size-adjust Special Notes:
- The legibility of a font is dependant on more than the font-size but also on the relationship between the size and the x-height.
- The higher the aspect value is, the more legible a font will be at smaller sizes.
- Font substitution that relies on font-size alone may rapidly render a page illegible.
- Compare the images on this page and you will see how different fonts look with adjusted aspect values. (You may need to scroll.)
