CSS font-size-adjust attribute

Definition and Usage

The font-size-adjust property sets an aspect value for an element, so that the x-height of the preferred font can be maintained.

Description

The ratio of the height of the lowercase letter 'x' to the height of the 'font-size' is called the aspect value of a font. When a font has a high aspect value, it is easier to read when the font is set to a very small size. For example: Verdana's aspect value is 0.58 (meaning when the font size is 100px, its x-height is 58px). Times New Roman's aspect value is 0.46. This means that Verdana is easier to read at small sizes than Times New Roman.

See Also:

CSS Tutorial:CSS Font

CSS Reference Manual:CSS font attribute

HTML DOM Reference Manual:fontSizeAdjust Property

Example

Set the font-size-adjust property of different HTML elements:

h1
  {
  font-size-adjust:0.58;
  
p
  {
  font-size-adjust:0.60;

Try It Yourself

CSS Syntax

font-size-adjust: number|none|initial|inherit;

Property Value

Value Description
none Default. If this font is not available, it does not maintain the x-height of this font.
number

Define the aspect value ratio of the font.

The formula that can be used:

Preferred font size * (font-size-adjust value / aspect value of the available font) = font size applied to the available font

Example:

If 14px Verdana (aspect value is 0.58) is not available, but the aspect value of a font that is available is 0.46, then the size of the substitute font will be 14 * (0.58/0.46) = 17.65px.

Technical Details

Default Value: none
Inheritance: yes
Version: CSS2
JavaScript Syntax: object.style.fontSizeAdjust="0.70"

Try It Yourself Example

Using font-size-adjust to set font size
This example demonstrates how to use font-size-adjust to set font size.

Browser support

The numbers in the table indicate the first browser version that fully supports this property.

Chrome IE / Edge Firefox Safari Opera
Not supported Not supported 3.0 Not supported Not supported