mozilla
Your Search Results

    font-size-adjust

    Summary

    The font-size-adjust CSS property specifies that font size should be chosen based on the height of lowercase letters rather than the height of capital letters. This is useful since the legibility of fonts, especially at small sizes, is determined more by the size of lowercase letters than by the size of capital letters.

    Legibility can become an issue when the first-choice font-family is unavailable and its replacement has a significantly different aspect ratio (the ratio of the size of lowercase letters to the size of the font).

    To use this property in a way that is compatible with browsers that do not support font-size-adjust, it is specified as a number that the font-size property is multiplied by. This means the value specified for the property should generally be the aspect ratio of the first choice font. For example, a style sheet that specifies

    font-size: 14px;  
    font-size-adjust: 0.5;
    

    is really specifying that the lowercase letters of the font should be 7px high (0.5 × 14px).

    Syntax

    /* Use the specified font size */
    font-size-adjust: none;
    
    /* Use a font size that makes lowercase
    letters half the specified font size */
    font-size-adjust: 0.5;
    
    /* Global values */
    font-size-adjust: inherit;
    font-size-adjust: initial;
    font-size-adjust: unset;
    

    Values

    none
    Choose the size of the font based only on the font-size property.
    <number>

    Choose the size of the font so that its lowercase letters (as determined by the x-height of the font) are the specified number times the font-size.

    The number specified should generally be the aspect ratio (ratio of x-height to font size) of the first choice font-family. This means that the first choice font, when available, will appear the same size in browsers, whether or not they support font-size-adjust.

    Formal syntax

    none | <number>

    Examples

    View Live Examples

    p {
       font: 12px Verdana, "DejaVu Sans", sans-serif;
       font-size-adjust: 0.58;
    } 

    Specifications

    Specification Status Comment
    CSS Fonts Module Level 3
    The definition of 'font-size-adjust' in that specification.
    Candidate Recommendation  

    The CSS property font-size-adjust was initially defined in CSS 2, but dropped in CSS 2.1. It has been newly defined in CSS 3.

    Browser compatibility

    Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
    Basic support

    44.0

    1.0 (1.0)
    Windows only
    Not supported  Not supported  Not supported 
    3.0 (1.9)
    All platforms
    Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile Chrome for Android
    Basic support ? 1.0 (1.9.2) ? ? ? 42.0

    See also

    Document Tags and Contributors

    Contributors to this page:
    Last updated by: Sebastianz,