RichInStyle.com
 Tutorials Bugs Masterclass Free stuff Test pages Proposals

Core tests
Attaching style Applying style Key concepts Color and background Fonts Text Lists Box model

Advanced tests
Positioning Boxes Generated content Dynamic effects Tables Paged media @font-face Aural styles Language styles

This test
Generic families Specific families UI fonts Font-size Size keywords
Size percentages Font-size-adjust Font-stretch Font-style
Font-variant Font-weight Font weights Font Line-height
Line-height 2 Line box heights Line box heights 2 Line box heights 3 Forms

RichInStyle.com tests: line-height 2

Relative unit test

% test

  1. The text below should be the same on both the right and left side (left side is font-size: 10px; line-height: 50px, the other is font-size: 10px; line-height: 500%):

    The same
    The same
    The same
    The same
    The same
    The same
    The same     		The same
    The same
    The same
    The same
    The same
    The same
    The same

  2. The text below should be the same on both the right and left side (left side is font-size: 10px; line-height: 50px, the other is font-size: 10px; line-height: 5em).

    The same
    The same
    The same
    The same
    The same
    The same
    The same     		The same
    The same
    The same
    The same
    The same
    The same
    The same

<number> test

  1. The text below should be the same on both the right and left side (left side is font-size: 10px; line-height: 50px, the other is font-size: 10px; line-height: 5).

    The same
    The same
    The same
    The same
    The same
    The same
    The same     		The same
    The same
    The same
    The same
    The same
    The same
    The same

  2. This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value). This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value). This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value). This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value). This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value).

  3. The following should be unreadable (line-height: 1.3em with font-size: 1px):

    This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value). This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value). This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value). This should have an appropriate (i.e., quite large) line height (line-height: 1.3; font-size: 1px on DIV, font-size: 16px on inner - scaling factor inherits, not the computed value).

Copyright © RichInStyle.com 2000; all rights reserved. See copyright document for terms of use. Please visit Bukit Lawang flood appeal.