CSS2.1 Test Suite

Text (494 tests)

Test Flags
16.1 Indentation: the 'text-indent' property
text-indent A
text-indent
Text-indent using pixels with a negative zero value, -0px
  • The 'text-indent' property sets a negative zero length value in pixels.
A
Text-indent using pixels with a zero value, 0px
  • Ensure that text-indent 0px adds 0px in front of the text.
A
Text-indent using pixels with a positive zero value, +0px
  • Ensure that text-indent +0px adds 0px in front of the text.
A
Text-indent using pixels with a nominal value, 96px
  • Ensure that text-indent 96px adds 96px in front of the text.
A
Text-indent using pixels with a nominal value with a plus sign, +96px
  • Ensure that text-indent +96px adds 96px in front of the text.
A
Text-indent using points with a negative zero value, -0pt
  • Ensure that text-indent -0 pt adds 0pt in front of the text.
A
Text-indent using points with a zero value, 0pt
  • Ensure that text-indent 0pt adds 0pt in front of the text.
A
Text-indent using points with a positive zero value, +0pt
  • Ensure that text-indent +0pt adds 0pt in front of the text.
A
Text-indent using points with a nominal value, 72pt
  • Ensure that text-indent 72pt adds 72pt in front of the text.
A
Text-indent using points with a nominal value with a plus sign, +72pt
  • Ensure that text-indent +72pt adds 72pt in front of the text.
A
Text-indent using picas with a negative zero value, -0pc
  • Ensure that text-indent -0 pc adds 0pc in front of the text.
A
Text-indent using picas with a zero value, 0pc
  • Ensure that text-indent 0pc adds 0pc in front of the text.
A
Text-indent using picas with a positive zero value, +0pc
  • Ensure that text-indent +0pc adds 0pc in front of the text.
A
Text-indent using picas with a nominal value, 6pc
  • Ensure that text-indent 6pc adds 6pc in front of the text.
A
Text-indent using picas with a nominal value with a plus sign, +6pc
  • Ensure that text-indent +6pc adds 6pc in front of the text.
A
Text-indent using centimeters with a negative zero value, -0cm
  • Ensure that text-indent -0 cm adds 0cm in front of the text.
A
Text-indent using centimeters with a zero value, 0cm
  • Ensure that text-indent 0cm adds 0cm in front of the text.
A
Text-indent using centimeters with a positive zero value, +0cm
  • Ensure that text-indent +0cm adds 0cm in front of the text.
A
Text-indent using centimeters with a nominal value, 2.54cm
  • Ensure that text-indent 2.54cm adds 2.54cm in front of the text.
A
Text-indent using centimeters with a nominal value with a plus sign, +2.54cm
  • Ensure that text-indent +2.54cm adds 2.54cm in front of the text.
A
Text-indent using millimeters with a negative zero value, -0mm
  • Ensure that text-indent -0 mm adds 0mm in front of the text.
A
Text-indent using millimeters with a zero value, 0mm
  • Ensure that text-indent 0mm adds 0mm in front of the text.
A
Text-indent using millimeters with a positive zero value, +0mm
  • Ensure that text-indent +0mm adds 0mm in front of the text.
A
Text-indent using millimeters with a nominal value, 25.4mm
  • Ensure that text-indent 25.4mm adds 25.4mm in front of the text.
A
Text-indent using millimeters with a nominal value with a plus sign, +25.4mm
  • Ensure that text-indent +25.4mm adds 25.4mm in front of the text.
A
Text-indent using inches with a negative zero value, -0in
  • Ensure that text-indent -0 in adds 0in in front of the text.
A
Text-indent using inches with a zero value, 0in
  • Ensure that text-indent 0in adds 0in in front of the text.
A
Text-indent using inches with a positive zero value, +0in
  • Ensure that text-indent +0in adds 0in in front of the text.
A
Text-indent using inches with a nominal value, 1in
  • Ensure that text-indent 1in adds 1in in front of the text.
A
Text-indent using inches with a nominal value with a plus sign, +1in
  • Ensure that text-indent +1in adds 1in in front of the text.
A
Text-indent using 'em' units with a negative zero value, -0em
  • Ensure that text-indent -0 em adds 0em in front of the text.
A
Text-indent using 'em' units with a zero value, 0em
  • Ensure that text-indent 0em adds 0em in front of the text.
A
Text-indent using 'em' units with a positive zero value, +0em
  • Ensure that text-indent +0em adds 0em in front of the text.
A
Text-indent using 'em' units with a nominal value, 6em
  • Ensure that text-indent 6em adds 6em in front of the text.
A
Text-indent using 'em' units with a nominal value with a plus sign, +6em
  • Ensure that text-indent +6em adds 6em in front of the text.
A
Text-indent using 'ex' units with a negative zero value, -0ex
  • The 'text-indent' property sets a negative zero length value in 'ex' units.
A
Text-indent using 'ex' units with a zero value, 0ex
  • Ensure that text-indent 0ex adds 0ex in front of the text.
A
Text-indent using 'ex' units with a positive zero value, +0ex
  • Ensure that text-indent +0ex adds 0ex in front of the text.
A
Text-indent set to a nominal value for 'ex' units
  • Ensure that text-indent 12ex adds 12ex in front of the text.
A
Text-indent set to a nominal value for 'ex' units with a plus sign
  • Ensure that text-indent +12ex adds 12ex in front of the text.
A
Text-indent using percentages with a negative zero value, +0%
  • The 'text-indent' property sets a negative zero length value in percentages.
A
Text-indent using percentages with a zero value, 0%
  • The 'text-indent' property sets a zero length value in percentages.
A
Text-indent using percentages with a positive zero value, +0%
  • The 'text-indent' property sets a positive zero length value in percentages.
A
Text-indent set to '50%'
  • Ensure that text-indent 50% adds 50% of its containing block's width in front of the text.
A
Text-indent set to '+50%'
  • Ensure that text-indent +50% adds 50% of its containing block's width in front of the text.
A
Text-indent set to a negative zero value with no units, '0'
  • Ensure that text-indent -0 adds 0 in front of the text.
A
Text-indent set to a zero value with no units, '0'
  • Ensure that text-indent 0 adds 0 in front of the text.
A
Text-indent set to a positive zero value with no units, +0
  • Ensure that text-indent +0 adds 0px in front of the text.
A
Text-indent set to 'inherit'
  • Ensure that text-indent with inherit uses its parent's value for text-indent.
A
Text-indent application on a 'display: inline' element
  • The 'text-indent' property is not applied to 'display: inline' elements.
A
Text-indent application on a 'display: block' element
  • The 'text-indent' property is applied to 'display: block' elements.
A
Text-indent application on a 'display: list-item' element
  • The 'text-indent' property is applied to display: list-item elements.
A
Text-indent application on a 'display: run-in' element
  • The 'text-indent' property is applied to 'display: run-in' elements.
A
Text-indent application on a 'display: inline-block' element
  • The 'text-indent' property is applied to 'display: inline-block' elements.
A
Text-indent application on a 'display: table' element
  • The 'text-indent' property is applied to 'display: table' elements.
A
Text-indent application on a 'display: inline-table' element
  • The 'text-indent' property is applied to 'display: inline-table' elements.
A
Text-indent application on a 'display: table-row-group' element
  • The 'text-indent' property is applied to 'display: table-row-group' elements.
A
Text-indent application on a 'display: table-header-group' element
  • The 'text-indent' property is applied to 'display: table-header-group' elements.
A
Text-indent application on a 'display: table-footer-group' element
  • The 'text-indent' property is applied to 'display: table-footer-group' elements.
A
Text-indent application on a 'display: table-row' element
  • The 'text-indent' property is applied to 'display: table-row' elements.
A
Text-indent application on a 'display: table-column-group' element
  • The 'text-indent' property is not applied to 'display: table-column-group' elements.
A
Text-indent application on a 'display: table-column' element
  • The 'text-indent' property is not applied to 'display: table-column' elements.
A
Text-indent application on a 'display: table-cell' element
  • The 'text-indent' property is applied to 'display: table-cell' elements.
A
Text-indent application on a 'display: table-caption' element
  • The 'text-indent' property is applied to 'display: table-caption' elements.
A
Text-indent and inline-block level inheritance
  • The 'text-indent' property is inherited by inline-block level elements resulting in a double indent.
A
Text-indent with negative value with overflow hidden
  • The 'text-indent' property with negative value follows the overflow hidden assignment.
Text-indent with negative value with 'overflow' set to 'visible'
  • The 'text-indent' property with negative value follows the 'overflow: visible' assignment.
A
Text-indent with value larger than the available width with 'overflow' set to 'visible'
  • The 'text-indent' property with a value exceeding the available width follows the 'overflow: visible' assignment.
A
Text-indent with value larger than the available width with 'overflow' set to 'hidden'
  • The 'text-indent' property with value exceeding the available width of the element follows the 'overflow: hidden' assignment.
Text-indent with 'direction' set to 'rtl'
  • The 'text-indent' property on an element with 'direction: rtl' indents from the right instead of left.
A
Text-indent with negative value
  • The 'text-indent' property with negative values with direction rtl indent to the right.
A
16.2 Alignment: the 'text-align' property
direction:rtl - unordered list
  • direction:rtl should apply to unordered lists, putting bullets on the right
direction:rtl - ordered list
  • direction:rtl should apply to nested ordered lists, putting bullets on the right and offset leftwards
Non-Replaced Float Not Fitting Beside Opposite Float
Replaced Elements AG
text-align
margin-right AG
margin-left AG
padding-right AG
padding-right A
padding-left AG
padding-left A
Text-align set to 'left'
  • The 'text-align' property set to 'left' on a block element aligns the text to the left.
Text-align set to 'right'
  • The 'text-align' property set to 'right' on a block element aligns the text to the right.
Text-align set to 'center'
  • The 'text-align' property set to 'center' on a block element aligns the text in the center.
Text-align set to 'justify'
  • Text-align justify on a block element aligns the text on both the left and right sides.
Text-align set to 'inherit'
  • The 'text-align' property set to a value of 'inherit' correctly inherits its value from the parent element.
text-align
  • text-align property determines how inline content of a block is horizontally aligned within such block. When a block-level element has no inline content, then setting text-align property should have no effect on the horizontal formating of the block itself.
Text-align application on a 'display: inline' element
  • The 'text-align' property is not applied to 'display: inline' element.
Text-align application on a 'display: block' element
  • The 'text-align' property is applied to 'display: block' elements.
Text-align application on a 'display: list-item' element
  • The 'text-align' property is applied to 'display: list-item' elements.
Text-align application on a 'display: run-in' element
  • The 'text-align' property is applied ton 'display: run-in' elements.
Text-align application on a 'display: inline-block' element
  • The 'text-align' property is applied to 'display: inline-block' elements.
Text-align application on a 'display: table' element
  • The 'text-align' property is applied to 'display: table' elements.
Text-align application on a 'display: inline-table' element
  • The 'text-align' property is applied to 'display: inline-table' elements.
Text-align application on a 'display: table-row-group' element
  • The 'text-align' property is applied to 'display: table-row-group' elements.
Text-align application on a 'display: table-header-group' element
  • The 'text-align' property is applied to 'display: table-header-group' elements.
Text-align application on a 'display: table-footer-group' element
  • The 'text-align' property is applied to 'display: table-footer-group' elements.
Text-align application on a 'display: table-row' element
  • The 'text-align' property is applied to 'display: table-row' elements.
Text-align application on a 'display: table-column-group' element
  • The 'text-align' property is not applied to a 'display: table-column-group' element.
Text-align application on a 'display: table-column' element
  • The 'text-align' property is not applied to a 'display: table-column' element.
Text-align application on a 'display: table-cell' element
  • The 'text-align' property is applied to 'display: table-cell' elements.
Text-align application on a 'display: table-caption' element
  • The 'text-align' property is applied to 'display: table-caption' elements.
Text-align inheritance on block level elements (spec example)
  • Ensure that block level elements inherit text-align values of parent elements.
Text-align set to 'justify' with 'white-space' set to 'pre'
  • Setting 'text-align' to 'justify' and 'white-space' to 'pre', text-align is computed to its initial value.
Text-align set to 'justify' with 'white-space' set to 'pre-line'
  • Setting 'text-align' to 'justify' and 'white-space' to 'pre-line', text-align is computed to its initial value.
Text-align set to 'justify' with 'white-space' set to 'pre-wrap'
  • Setting 'text-align' to 'justify' and 'white-space' to 'pre-wrap', text-align is computed to its initial value.
Text-align set to 'justify' with 'white-space' set to 'nowrap'
  • Setting 'text-align' to 'justify' and 'white-space' to 'nowrap', text-align is computed to 'justify'.
Text-align set to 'justify' with 'white-space' set to 'pre' and 'direction' set to 'rtl'
  • Setting 'text-align' to 'justify' and 'white-space' to 'pre', text-align is computed to its initial value.
Text-align set to 'justify' with 'white-space' set to 'pre-line' and 'direction' set to 'rtl'
  • Setting 'text-align' to 'justify' and 'white-space' to 'pre-line', text-align is computed to its initial value.
Text-align set to 'justify' with 'white-space' set to 'nowrap' and 'direction' set to 'rtl'
  • Setting 'text-align' to 'justify' and 'white-space' to 'nowrap', text-align is computed to 'justify'.
Text-align set to 'justify' with 'white-space' set to 'pre-wrap' and 'direction' set to 'rtl'
  • Setting 'text-align' to 'justify' and 'white-space' to 'pre-wrap', text-align is computed to its initial value.
16.3 Decoration
16.3.1 Underlining, overlining, striking, and blinking: the 'text-decoration' property
Inheritance
Text-decoration set to 'underline'
  • The 'text-decoration' property set to 'underline' renders the appropriate decorations.
Text-decoration set to 'overline'
  • The 'text-decoration' property set to 'overline' renders the appropriate decorations.
Text-decoration set to 'line-through'
  • The 'text-decoration' property set to 'line-through' renders the appropriate decorations.
Text-decoration set to 'blink'
  • The 'text-decoration' property set to 'blink' renders the appropriate decorations.
M
Text-decoration set to 'underline overline'
  • Ensure that text-decoration underline, overline applied to paragraph element.
Text-decoration set to 'underline line-through'
  • Ensure that text-decoration underline, line-through applied to paragraph element.
Text-decoration set to 'underline blink'
  • Ensure that text-decoration underline, blink is applied to an inline element.
M
Text-decoration set to 'overline underline'
  • Ensure that text-decoration overline underline is applied to a paragraph element.
Text-decoration set to 'overline line-through'
  • The 'text-decoration' property set to 'overline line-through' renders the appropriate decorations.
Text-decoration set to 'overline blink'
  • The 'text-decoration' property set to 'overline blink' renders the appropriate decorations.
M
Text-decoration set to 'line-through underline'
  • The 'text-decoration' property set to 'line-through underline' renders the appropriate decorations.
Text-decoration set to 'line-through overline'
  • The 'text-decoration' property set to 'line-through overline' renders the appropriate decorations.
Text-decoration set to 'line-through blink'
  • The 'text-decoration' property set to 'line-through blink' renders the appropriate decorations.
M
Text-decoration set to 'blink underline'
  • The 'text-decoration' property set to 'blink underline' renders the appropriate decorations.
M
Text-decoration set to 'blink overline'
  • The 'text-decoration' property set to 'blink overline' renders the appropriate decorations.
M
Text-decoration set to 'blink line-through'
  • The 'text-decoration' property set to 'blink line-through' renders the appropriate decorations.
M
Text-decoration set to 'underline overline line-through'
  • The 'text-decoration' property set to 'underline overline line-through' renders the appropriate decorations.
Text-decoration set to 'underline overline blink'
  • The 'text-decoration' property set to 'underline overline blink' renders the appropriate decorations.
M
Text-decoration set to 'underline line-through overline'
  • The 'text-decoration' property set to 'underline line-through overline' renders the appropriate decorations.
Text-decoration set to 'underline line-through blink'
  • The 'text-decoration' property set to 'underline line-through blink' renders the appropriate decorations.
M
Text-decoration set to 'underline blink overline'
  • The 'text-decoration' property set to 'underline blink overline' renders the appropriate decorations.
M
Text-decoration set to 'underline blink line-through'
  • The 'text-decoration' property set to 'underline blink line-through' renders the appropriate decorations.
M
Text-decoration set to 'overline underline line-through'
  • The 'text-decoration' property set to 'overline underline line-through' renders the appropriate decorations.
Text-decoration set to 'overline underline blink'
  • The 'text-decoration' property set to 'overline underline blink' renders the appropriate decorations.
M
Text-decoration set to 'overline line-through underline'
  • The 'text-decoration' property set to 'overline line-through underline' renders the appropriate decorations.
Text-decoration set to 'overline line-through blink'
  • The 'text-decoration' property set to 'overline line-through blink' renders the appropriate decorations.
M
Text-decoration set to 'overline blink underline'
  • The 'text-decoration' property set to 'overline blink underline' renders the appropriate decorations.
M
Text-decoration set to 'overline blink line-through'
  • The 'text-decoration' property set to 'overline blink line-through' renders the appropriate decorations.
M
Text-decoration set to 'line-through underline overline'
  • The 'text-decoration' property set to 'line-through underline overline' renders the appropriate decorations.
Text-decoration set to 'line-through underline blink'
  • The 'text-decoration' property set to 'line-through underline blink' renders the appropriate decorations.
M
Text-decoration set to 'line-through overline underline'
  • The 'text-decoration' property set to 'line-through overline underline' renders the appropriate decorations.
Text-decoration set to 'line-through overline blink'
  • The 'text-decoration' property set to 'line-through overline blink' renders the appropriate decorations.
M
Text-decoration set to 'line-through blink underline'
  • The 'text-decoration' property set to 'line-through blink underline' renders the appropriate decorations.
M
Text-decoration set to 'line-through blink overline'
  • The 'text-decoration' property set to 'line-through blink overline' renders the appropriate decorations.
M
Text-decoration set to 'blink underline overline'
  • The 'text-decoration' property set to 'blink underline overline' renders the appropriate decorations.
M
Text-decoration set to 'blink underline line-through'
  • The 'text-decoration' property set to 'blink underline line-through' renders the appropriate decorations.
M
Text-decoration set to 'blink overline underline'
  • The 'text-decoration' property set to 'blink overline underline' renders the appropriate decorations.
M
Text-decoration set to 'blink overline line-through'
  • The 'text-decoration' property set to 'blink overline line-through' renders the appropriate decorations.
M
Text-decoration set to 'blink line-through underline'
  • The 'text-decoration' property set to 'blink line-through underline' renders the appropriate decorations.
M
Text-decoration set to 'blink line-through overline'
  • The 'text-decoration' property set to 'blink line-through overline' renders the appropriate decorations.
M
Text-decoration set to 'underline overline line-through blink'
  • The 'text-decoration' property set to 'underline overline line-through blink' renders the appropriate decorations.
M
Text-decoration set to 'underline overline blink line-through'
  • The 'text-decoration' property set to 'underline overline blink line-through' renders the appropriate decorations.
M
Text-decoration set to 'underline line-through overline blink'
  • The 'text-decoration' property set to 'underline line-through overline blink' renders the appropriate decorations.
M
Text-decoration set to 'underline line-through blink overline'
  • The 'text-decoration' property set to 'underline line-through blink overline' renders the appropriate decorations.
M
Text-decoration set to 'underline blink overline line-through'
  • The 'text-decoration' property set to 'underline blink overline line-through' renders the appropriate decorations.
M
Text-decoration set to 'underline blink line-through overline'
  • The 'text-decoration' property set to 'underline blink line-through overline' renders the appropriate decorations.
M
Text-decoration set to 'overline underline line-through blink'
  • The 'text-decoration' property set to 'overline underline line-through blink' renders the appropriate decorations.
M
Text-decoration set to 'overline underline blink line-through'
  • The 'text-decoration' property set to 'overline underline blink line-through' renders the appropriate decorations.
M
Text-decoration set to 'overline line-through underline blink'
  • The 'text-decoration' property set to 'overline line-through underline blink' renders the appropriate decorations.
M
Text-decoration set to 'overline line-through blink underline'
  • The 'text-decoration' property set to 'overline line-through blink underline' renders the appropriate decorations.
M
Text-decoration set to 'overline blink underline line-through'
  • The 'text-decoration' property set to 'overline blink underline line-through' renders the appropriate decorations.
M
Text-decoration set to 'overline blink line-through underline'
  • The 'text-decoration' property set to 'overline blink line-through underline' renders the appropriate decorations.
M
Text-decoration set to 'line-through underline overline blink'
  • The 'text-decoration' property set to 'line-through underline overline blink' renders the appropriate decorations.
M
Text-decoration set to 'line-through underline blink overline'
  • The 'text-decoration' property set to 'line-through underline blink overline' renders the appropriate decorations.
M
Text-decoration set to 'line-through overline underline blink'
  • The 'text-decoration' property set to 'line-through overline underline blink' renders the appropriate decorations.
M
Text-decoration set to 'line-through overline blink underline'
  • The 'text-decoration' property set to 'line-through overline blink underline' renders the appropriate decorations.
M
Text-decoration set to 'line-through blink underline overline'
  • The 'text-decoration' property set to 'line-through blink underline overline' renders the appropriate decorations.
M
Text-decoration set to 'line-through blink overline underline'
  • The 'text-decoration' property set to 'line-through blink overline underline' renders the appropriate decorations.
M
Text-decoration set to 'blink underline overline line-through'
  • The 'text-decoration' property set to 'blink underline overline line-through' renders the appropriate decorations.
M
Text-decoration set to 'blink underline line-through overline'
  • The 'text-decoration' property set to 'blink underline line-through overline' renders the appropriate decorations.
M
Text-decoration set to 'blink overline underline line-through'
  • The 'text-decoration' property set to 'blink overline underline line-through' renders the appropriate decorations.
M
Text-decoration set to 'blink overline line-through underline'
  • The 'text-decoration' property set to 'blink overline line-through underline' renders the appropriate decorations.
M
Text-decoration set to 'blink line-through underline overline'
  • The 'text-decoration' property set to 'blink line-through underline overline' renders the appropriate decorations.
M
Text-decoration set to 'blink line-through overline underline'
  • The 'text-decoration' property set to 'blink line-through overline underline' renders the appropriate decorations.
M
Text-decoration set to 'none'
  • The 'text-decoration' property set to 'none' does not render any text decorations.
Text-decoration set to 'inherit', inheriting one value
  • The 'text-decoration' set to 'inherit' on an element will inherit the text-decoration set on the div1 element.
Text-decoration set to 'inherit', inheriting two values
  • The 'text-decoration' set to 'inherit' on an element will inherit the text-decoration set on the div1 element.
Text-decoration set to 'inherit', inheriting three values
  • The 'text-decoration' set to 'inherit' on an element will inherit the text-decoration set on the div1 element.
Text-decoration set to 'inherit', inheriting four values
  • The 'text-decoration' set to 'inherit' on an element will inherit the text-decoration set on the div1 element.
M
'text-decoration' - 'color' inheritance
  • The color of 'text-decoration' of ascendant must be applied to descendants even if descendant elements have different 'color' values
'text-decoration' - inheritance exception 1
  • 'text-decoration' values must not be propagated to floating descendants
'text-decoration' - inheritance exception 2
  • 'text-decoration' values must not be propagated to absolutely-positioned descendants
'text-decoration' - inheritance exception 3
  • 'text-decoration' values must not be propagated to the contents of 'inline-table' descendants
'text-decoration' - inheritance exception 4
  • 'text-decoration' values must not be propagated to the contents of 'inline-block' descendants
Text-decoration set to 'underline' on a elements (spec example)
  • Text-decoration set to 'underline' is applied to a elements.
Text-decoration application on an 'inline' element
  • The 'text-decoration' property applies to an 'inline' element.
Text-decoration application on a 'block' element
  • The 'text-decoration' property applies to a 'block' element.
Text-decoration application on a 'list-item' element
  • The 'text-decoration' property applies to a 'list-item' element.
Text-decoration application on a 'run-in' element
  • The 'text-decoration' property applies to a 'run-in' element.
Text-decoration application on an 'inline-block' element
  • The 'text-decoration' property applies to an 'inline-block' element.
Text-decoration application on a 'table' element
  • The 'text-decoration' property applies to a 'table' element.
Text-decoration application on an 'inline-table' element
  • The 'text-decoration' property applies to an 'inline-table' element.
Text-decoration application on a 'table-row-group' element
  • The 'text-decoration' property applies to a 'table-row-group' element.
Text-decoration application on a 'table-header-group' element
  • The 'text-decoration' property applies to a 'table-header-group' element.
Text-decoration application on a 'table-footer-group' element
  • The 'text-decoration' property applies to a 'table-footer-group' element.
Text-decoration application on a 'table-row' element
  • The 'text-decoration' property applies to a 'table-row' element.
Text-decoration application on a table-column-group element
  • The 'text-decoration' property does not apply to a table-column-group element
Text-decoration application on a table-column element
  • The 'text-decoration' property does not apply to a table-column element
Text-decoration application on a 'table-cell' element
  • The 'text-decoration' property applies to a 'table-cell' element.
Text-decoration application on a 'table-caption' element
  • The 'text-decoration' property applies to a 'table-caption' element.
Text-decoration set to 'underline' on 'border'
  • The 'text-decoration' property set to 'underline' is not applied to 'border' in elements.
Text-decoration set to 'overline' on 'border'
  • The 'text-decoration' property set to 'overline' is not applied to 'border' in elements.
Text-decoration set to 'line-through' on 'border'
  • The 'text-decoration' property set to 'line-through' is not applied to 'border' in elements.
Text-decoration with 'color'
  • Text-decoration is the color set on the element.
Text-decoration and 'color' on parent elements
  • The 'text-decoration' property set to 'color' is equal to the color on the element with 'text-decoration' set on it, even if a descendent element has a different color.
Text-decoration on images
  • Text-decoration is not applied to images.
G
Text-decoration set to 'underline' on 'margin'
  • The 'text-decoration' property set to 'underline' is not applied to 'margin' in elements.
Text-decoration set to 'overline' on 'margin'
  • The 'text-decoration' property set to 'overline' is not applied to 'margin' in elements.
Text-decoration set to 'line-through' on 'margin'
  • The 'text-decoration' property set to 'line-through' is not applied to 'margin' in elements.
Text-decoration set to 'underline' on 'padding'
  • The 'text-decoration' property set to 'underline' is not applied to 'padding' in elements.
Text-decoration set to 'overline' on 'padding'
  • The 'text-decoration' property set to 'overline' is not applied to 'padding' in elements.
Text-decoration set to 'line-through' on 'padding'
  • The 'text-decoration' property set to 'line-through' is not applied to 'padding' in elements.
Text-decoration on ancestors
  • Text-decoration on a child does not affect the parent element's 'text-decoration'.
Text-decoration on inline elements with multiple boxes
  • The 'text-decoration' property set to 'underline' is applied to all boxes within inline element (in this case, with different styles).
Text-decoration inheritance to inline elements
  • Text-decoration is applied to anonymous inline element for block level elements with text not in inline element.
Text-decoration inheritance to block level elements
  • Text-decoration is inherited by block level elements from block level elements.
Text-decoration on floated children
  • Text-decoration is not propagated to children elements that are floated.
Text-decoration on absolutely positioned children
  • Text-decoration is not propagated to children elements that are absolutely positioned.
Text-decoration on 'inline-table' children
  • Text-decoration is not propagated to children elements that are 'inline-tables'.
Text-decoration on 'inline-block' children
  • Text-decoration is not propagated to children elements that are 'inline-block'.
Text-decoration on descendents with relative positioning
  • Text-decoration is moved with relative positioned elements.
Text-decoration set to 'underline' on white space
  • The 'text-decoration' property set to 'underline' is applied to white space in elements.
Text-decoration set to 'overline' on white space
  • The 'text-decoration' property set to 'overline' is applied to white space in elements.
Text-decoration set to 'line-through' on white space
  • The 'text-decoration' property set to 'line-through' is applied to white space in elements.
Text-decoration set to 'underline' on 'letter-spacing'
  • The 'text-decoration' property set to 'underline' is applied to 'letter-spacing' in elements.
Text-decoration set to 'overline' on 'letter-spacing'
  • The 'text-decoration' property set to 'overline' is applied to 'letter-spacing' in elements.
Text-decoration set to 'line-through' on 'letter-spacing'
  • The 'text-decoration' property set to 'line-through' is applied to 'letter-spacing' in elements.
Text-decoration set to 'underline' on 'word-spacing'
  • The 'text-decoration' property set to 'underline' is applied to 'word-spacing' in elements.
Text-decoration set to 'overline' on 'word-spacing'
  • The 'text-decoration' property set to 'overline' is applied to 'word-spacing' in elements.
Text-decoration set to 'line-through' on 'word-spacing'
  • The 'text-decoration' property set to 'line-through' is applied to 'word-spacing' in elements.
Text-decoration underline across elements with different font sizes
  • Thickness and baseline are the same for all children of elements with 'text-decoration' set.
text-decoration:underline - visibility:hidden 1
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:underline - visibility:hidden 2
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:underline - visibility:hidden 3
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:underline - visibility:hidden 4
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:overline - visibility:hidden 5
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:overline - visibility:hidden 6
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:overline - visibility:hidden 7
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:overline - visibility:hidden 8
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:line-through - visibility:hidden 9
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:line-through - visibility:hidden 10
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:line-through - visibility:hidden 11
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
text-decoration:line-through - visibility:hidden 12
  • Inline element with 'visibility:hidden' must not prevent a text-decoration value being applied to the line box
16.4 Letter and word spacing: the 'letter-spacing' and 'word-spacing' properties
word-spacing A
word-spacing A
letter-spacing A
letter-spacing A
Letter-spacing using pixels with a negative zero value, -0px
  • The 'letter-spacing' property sets a negative zero length value in pixels.
A
Letter-spacing using pixels with a zero value, 0px
  • The 'letter-spacing' property sets a zero length value in pixels.
A
Letter-spacing using pixels with a positive zero value, +0px
  • The 'letter-spacing' property sets a positive zero length value in pixels.
A
Letter-spacing using pixels with a nominal value, 96px
  • The 'letter-spacing' property sets a nominal length value in pixels.
A
Letter-spacing using pixels with a nominal value with a plus sign, +96px
  • The 'letter-spacing' property sets a nominal length value in pixels with a plus sign.
A
Letter-spacing using points with a negative zero value, -0pt
  • The 'letter-spacing' property sets a negative zero length value in points.
A
Letter-spacing using points with a zero value, 0pt
  • The 'letter-spacing' property sets a zero length value in points.
A
Letter-spacing using points with a positive zero value, +0pt
  • The 'letter-spacing' property sets a positive zero length value in points.
A
Letter-spacing using points with a nominal value, 72pt
  • The 'letter-spacing' property sets a nominal length value in points.
A
Letter-spacing using points with a nominal value with a plus sign, +72pt
  • The 'letter-spacing' property sets a nominal length value in points with a plus sign.
A
Letter-spacing using picas with a negative zero value, -0pc
  • The 'letter-spacing' property sets a negative zero length value in picas.
A
Letter-spacing using picas with a zero value, 0pc
  • The 'letter-spacing' property sets a zero length value in picas.
A
Letter-spacing using picas with a positive zero value, +0pc
  • The 'letter-spacing' property sets a positive zero length value in picas.
A
Letter-spacing using picas with a nominal value, 6pc
  • The 'letter-spacing' property sets a nominal length value in picas.
A
Letter-spacing using picas with a nominal value with a plus sign, +6pc
  • The 'letter-spacing' property sets a nominal length value in picas with a plus sign.
A
Letter-spacing using centimeters with a negative zero value, -0cm
  • The 'letter-spacing' property sets a negative zero length value in centimeters.
A
Letter-spacing using centimeters with a zero value, 0cm
  • The 'letter-spacing' property sets a zero length value in centimeters.
A
Letter-spacing using centimeters with a positive zero value, +0cm
  • The 'letter-spacing' property sets a positive zero length value in centimeters.
A
Letter-spacing using centimeters with a nominal value, 2.54cm
  • The 'letter-spacing' property sets a nominal length value in centimeters.
A
Letter-spacing using centimeters with a nominal value with a plus sign, +2.54cm
  • The 'letter-spacing' property sets a nominal length value in centimeters with a plus sign.
A
Letter-spacing using millimeters with a negative zero value, -0mm
  • The 'letter-spacing' property sets a negative zero length value in millimeters.
A
Letter-spacing using millimeters with a zero value, 0mm
  • The 'letter-spacing' property sets a zero length value in millimeters.
A
Letter-spacing using millimeters with a positive zero value, +0mm
  • The 'letter-spacing' property sets a positive zero length value in millimeters.
A
Letter-spacing using millimeters with a nominal value, 25.4mm
  • The 'letter-spacing' property sets a nominal length value in millimeters.
A
Letter-spacing using millimeters with a nominal value with a plus sign, +25.4mm
  • The 'letter-spacing' property sets a nominal length value in millimeters with a plus sign.
A
Letter-spacing using inches with a negative zero value, -0in
  • The 'letter-spacing' property sets a negative zero length value in inches.
A
Letter-spacing using inches with a zero value, 0in
  • The 'letter-spacing' property sets a zero length value in inches.
A
Letter-spacing using inches with a positive zero value, +0in
  • The 'letter-spacing' property sets a positive zero length value in inches.
A
Letter-spacing using inches with a nominal value, 1in
  • The 'letter-spacing' property sets a nominal length value in inches.
A
Letter-spacing using inches with a nominal value with a plus sign, +1in
  • The 'letter-spacing' property sets a nominal length value in inches with a plus sign.
A
Letter-spacing using 'em' units with a negative zero value, -0em
  • The 'letter-spacing' property sets a negative zero length value in 'em' units.
A
Letter-spacing using 'em' units with a zero value, 0em
  • The 'letter-spacing' property sets a zero length value in 'em' units.
A
Letter-spacing using 'em' units with a positive zero value, +0em
  • The 'letter-spacing' property sets a positive zero length value in 'em' units.
A
Letter-spacing using 'em' units with a nominal value, 6em
  • The 'letter-spacing' property sets a nominal length value in 'em' units.
A
Letter-spacing using 'em' units with a nominal value with a plus sign, +6em
  • The 'letter-spacing' property sets a nominal length value in 'em' units with a plus sign.
A
Letter-spacing using 'ex' units with a negative zero value, -0ex
  • The 'letter-spacing' property sets a negative zero length value in 'ex' units.
A
Letter-spacing using 'ex' units with a zero value, 0ex
  • The 'letter-spacing' property sets a zero length value in 'ex' units.
A
Letter-spacing using 'ex' units with a positive zero value, +0ex
  • The 'letter-spacing' property sets a positive zero length value in 'ex' units.
A
Letter-spacing using 'ex' units with a nominal value, 12ex
  • The 'letter-spacing' property sets a nominal length value in 'ex' units.
A
Letter-spacing using 'ex' units with a nominal value with a plus sign, +12ex
  • The 'letter-spacing' property sets a nominal length value in 'ex' units with a plus sign.
A
Letter-spacing sets a negative zero value with no units, -0
  • The 'letter-spacing' property sets a negative zero length value with no units.
A
Letter-spacing sets a zero value with no units, 0
  • The 'letter-spacing' property sets a zero length value with no units.
A
Letter-spacing sets a positive zero value with no units, +0
  • The 'letter-spacing' property sets a positive zero length value with no units.
A
Letter-spacing set to 'normal'
  • The 'letter-spacing' property set to 'normal' sets the typical spacing for letters based on the font.
A
Letter-spacing set to 'inherit'
  • The 'letter-spacing' set to 'inherit' uses its parents' value for the spacing of letters.
A
Letter-spacing application on a 'display: inline' element
  • The 'letter-spacing' property is applied to 'display: inline' elements.
A
Letter-spacing application on a 'display: block' element
  • The 'letter-spacing' property is applied to 'display: block' elements.
A
Letter-spacing application on a 'display: list-item' element
  • The 'letter-spacing' property is applied to 'display: list-item' elements.
A
Letter-spacing application on a 'display: run-in' element
  • The 'letter-spacing' property is applied to 'display: run-in' elements.
A
Letter-spacing application on a 'display: inline-block' element
  • The 'letter-spacing' property is applied to 'display: inline-block' elements.
A
Letter-spacing application on a 'display: table' element
  • The 'letter-spacing' property is applied to 'display: table' elements.
A
Letter-spacing application on a 'display: inline-table' element
  • The 'letter-spacing' property is applied to 'display: inline-table' elements.
A
Letter-spacing application on a 'display: table-row-group' element
  • The 'letter-spacing' property is applied to 'display: table-row-group' elements.
A
Letter-spacing application on a 'display: table-header-group' element
  • The 'letter-spacing' property is applied to 'display: table-header-group' elements.
A
Letter-spacing application on a 'display: table-footer-group' element
  • The 'letter-spacing' property is applied to 'display: table-footer-group' elements.
A
Letter-spacing application on a 'display: table-row' element
  • The 'letter-spacing' property is applied to 'display: table-row' elements.
A
Letter-spacing application on a 'display: table-column-group' element
  • The 'letter-spacing' property does not apply to 'display: table-column-group' elements.
A
Letter-spacing application on a 'display: table-column' element
  • The 'letter-spacing' property does not apply to 'display: table-column' elements.
A
Letter-spacing application on a 'display: table-cell' element
  • The 'letter-spacing' property is applied to 'display: table-cell' elements.
A
Letter-spacing application on a 'display: table-caption' element
  • The 'letter-spacing' property is applied to 'display: table-caption' elements.
A
Letter-spacing and 'text-align: justify'
  • The letter-spacing is not changed when combined with 'text-align: justify'.
A
Word-spacing using pixels with a negative zero value, -0px
  • The 'word-spacing' property sets a negative zero length value in pixels.
A
Word-spacing using pixels with a zero value, 0px
  • The 'word-spacing' property sets a zero length value in pixels.
A
Word-spacing using pixels with a positive zero value, +0px
  • The 'word-spacing' property sets a positive zero length value in pixels.
A
Word-spacing normal pixel on an element
  • Ensure that word-spacing 96px adds 96px (in addition to default spacing) between words in the element.
A
Word-spacing +normal pixel on an element
  • Ensure that word-spacing +96px adds 96px (in addition to default spacing) between words in the element.
A
Word-spacing using points with a negative zero value, -0pt
  • The 'word-spacing' property sets a negative zero length value in points.
A
Word-spacing using points with a zero value, 0pt
  • The 'word-spacing' property sets a zero length value in points.
A
Word-spacing using points with a positive zero value, +0pt
  • The 'word-spacing' property sets a positive zero length value in points.
A
Word-spacing set to a nominal value of '72pt'
  • Ensure that letter-spacing 72pt adds 72pt (in addition to default spacing) between letters in the element.
A
Word-spacing +normal pt on an element
  • Ensure that word-spacing +72pt adds +72 points (in addition to default spacing) between words in the element.
A
Word-spacing using picas with a negative zero value, -0pc
  • The 'word-spacing' property sets a negative zero length value in picas.
A
Word-spacing using picas with a zero value, 0pc
  • The 'word-spacing' property sets a zero length value in picas.
A
Word-spacing using picas with a positive zero value, +0pc
  • The 'word-spacing' property sets a positive zero length value in picas.
A
Word-spacing normal pc on an element
  • Ensure that word-spacing 6pc adds 6pc (in addition to default spacing) between words in the element.
A
Word-spacing +normal pc on an element
  • Ensure that word-spacing +6pc adds 6pc (in addition to default spacing) between words in the element.
A
Word-spacing using centimeters with a negative zero value, -0cm
  • The 'word-spacing' property sets a negative zero length value in centimeters.
A
Word-spacing using centimeters with a zero value, 0cm
  • The 'word-spacing' property sets a zero length value in centimeters.
A
Word-spacing using centimeters with a positive zero value, +0cm
  • The 'word-spacing' property sets a positive zero length value in centimeters.
A
Word-spacing normal cm on an element
  • Ensure that word-spacing 2.54cm adds 2.54cm (in addition to default spacing) between words in the element.
A
Word-spacing +normal cm on an element
  • Ensure that word-spacing +2.54cm adds 2.54cm (in addition to default spacing) between words in the element.
A
Word-spacing using millimeters with a negative zero value, -0mm
  • The 'word-spacing' property sets a negative zero length value in millimeters.
A
Word-spacing using millimeters with a zero value, 0mm
  • The 'word-spacing' property sets a zero length value in millimeters.
A
Word-spacing using millimeters with a positive zero value, +0mm
  • The 'word-spacing' property sets a positive zero length value in millimeters.
A
Word-spacing normal mm on an element
  • Ensure that word-spacing 25.4mm adds 25.4mm (in addition to default spacing) between words in the element.
A
Word-spacing +normal mm on an element
  • Ensure that word-spacing +25.4mm adds 25.4mm (in addition to default spacing) between words in the element.
A
Word-spacing using inches with a negative zero value, -0in
  • The 'word-spacing' property sets a negative zero length value in inches.
A
Word-spacing using inches with a zero value, 0in
  • The 'word-spacing' property sets a zero length value in inches.
A
Word-spacing using inches with a positive zero value, +0in
  • The 'word-spacing' property sets a positive zero length value in inches.
A
Word-spacing normal in on an element
  • Ensure that word-spacing 1in adds 1in (in addition to default spacing) between words in the element.
A
Word-spacing +normal in on an element
  • Ensure that word-spacing +1in adds 1in (in addition to default spacing) between words in the element.
A
Word-spacing using 'em' units with a negative zero value, -0em
  • The 'word-spacing' property sets a negative zero length value in 'em' units.
A
Word-spacing using 'em' units with a zero value, 0em
  • The 'word-spacing' property sets a zero length value in 'em' units.
A
Word-spacing using 'em' units with a positive zero value, +0em
  • The 'word-spacing' property sets a positive zero length value in 'em' units.
A
Word-spacing normal em on an element
  • Ensure that word-spacing 6em adds 6em (in addition to default spacing) between words in the element.
A
Word-spacing +normal em on an element
  • Ensure that word-spacing +6em adds 6em (in addition to default spacing) between words in the element.
A
Word-spacing using 'ex' units with a negative zero value, -0ex
  • The 'word-spacing' property sets a negative zero length value in 'ex' units.
A
Word-spacing using 'ex' units with a zero value, 0ex
  • The 'word-spacing' property sets a zero length value in 'ex' units.
A
Word-spacing using 'ex' units with a positive zero value, +0ex
  • The 'word-spacing' property sets a positive zero length value in 'ex' units.
A
Word-spacing nominal ex on an element
  • Ensure that word-spacing 12ex adds 12ex (in addition to default spacing) between words in the element.
A
Word-spacing +normal ex on an element
  • Ensure that word-spacing +12ex adds 12ex (in addition to default spacing) between words in the element.
A
Word-spacing -0 on an element
  • Ensure that word-spacing -0 adds 0 (in addition to default spacing) between words in the element.
A
Word-spacing 0 on an element
  • Ensure that word-spacing 0 adds no extra space (in addition to default spacing) between words in the element.
A
Word-spacing +0 on an element
  • Ensure that word-spacing +0 adds no extra space (in addition to default spacing) between words in the element.
A
Word-spacing set to 'normal'
  • The 'word-spacing' property set to normal does not change spacing between words.
A
Word-spacing inherit on an element
  • Ensure that word-spacing with inherit uses its parents value for word-spacing.
A
Word-spacing application to 'display: inline' element
  • The 'word-spacing' property applies to 'display: inline' elements.
A
Word-spacing application to 'display: block' element
  • The 'word-spacing' property applies to 'display: block' elements.
A
Word-spacing application to 'display: list-item' element
  • The 'word-spacing' property applies to 'display: list-item' elements.
A
Word-spacing application to 'display: run-in' element
  • The 'word-spacing' property applies to 'display: run-in' elements.
A
Word-spacing application to 'display: inline-block' element
  • The 'word-spacing' property applies to 'display: inline-block' elements.
A
Word-spacing application to 'display: table' element
  • The 'word-spacing' property applies to 'display: table' elements.
A
Word-spacing application to 'display: inline-table' element
  • The 'word-spacing' property applies to 'display: inline-table' elements.
A
Word-spacing application to 'display: table-row-group' element
  • The 'word-spacing' property applies to 'display: table-row-group' elements.
A
Word-spacing application to 'display: table-header-group' element
  • The 'word-spacing' property applies to 'display: table-header-group' elements.
A
Word-spacing application to 'display: table-footer-group' element
  • The 'word-spacing' property applies to 'display: table-footer-group' elements.
A
Word-spacing application to 'display: table-row' element
  • The 'word-spacing' property applies to 'display: table-row' elements.
A
Word-spacing application to 'display: table-column-group' element
  • The 'word-spacing' property is not applied to 'display: table-column-group' elements.
A
Word-spacing application to 'display: table-column' element
  • The 'word-spacing' property is not applied to 'display: table-column' elements.
A
Word-spacing application to 'display: table-cell' element
  • The 'word-spacing' property applies to 'display: table-cell' elements.
A
Word-spacing application to 'display: table-caption' element
  • The 'word-spacing' property applies to 'display: table-caption' elements.
A
Word-spacing and 'text-align: justify'
  • The word spacing is changed when combined with 'text-align: justify'.
A
Word-spacing and white space with multiple spaces
  • The white space processing removes spaces before 'word-spacing' is applied.
A
Word-spacing and white space with multiple non-breaking spaces
  • The white space processing removes non-breaking space before 'word-spacing' is applied.
A
Word-spacing and white space with multiple ideographic spaces
  • The white space processing removes ideographic space before 'word-spacing' is applied.
A
Word-spacing and white space with multiple preserved spaces
  • Any space left after white-space processing model occurs, has word-spacing applied to it.
A
Word-spacing and white space with multiple preserved spaces
  • Any non-breaking space left after white-space processing model occurs, has word-spacing applied to it.
A
Word-spacing and white space with multiple preserved spaces
  • Any ideographic space left after white-space processing model occurs, has word-spacing applied to it.
A
16.5 Capitalization: the 'text-transform' property
text-transform AG
:first-line pseudo-element - text-transform
:first-line pseudo-element - text-transform
  • The :first-line pseudo-element can be attached to an unordered list because it is a block-level element. The "first formatted line" of an unordered list occurs inside its first list-item because it is a non-positioned and non-floated block-level descendant in the same flow. User agents may change the document's layout (preferred behavior but nonetheless optional) when the viewport is resized.
Text-transform set to 'capitalize'
  • The 'text-transform' property set to 'capitalize' on an element makes the first character of every word uppercase.
Text-transform set to 'lowercase'
  • The 'text-transform' property set to 'lowercase' on an element makes every letter lowercase.
Text-transform set to 'uppercase'
  • The 'text-transform' property set to 'uppercase' on an element makes every letter uppercase.
Text-transform set to 'none'
  • The 'text-transform' property set to 'none' on an element makes no changes to the text.
Text-transform set to 'inherit'
  • The 'text-transform' property set to 'inherit' on an element inherits its parent element's 'text-transform' value.
Text-transform application to 'display: inline' element
  • The 'text-transform' property is applied to 'display: inline' elements.
Text-transform application to 'display: block' element
  • The 'text-transform' property is applied to 'display: block' elements.
Text-transform application to 'display: list-item' element
  • The 'text-transform' property is applied to 'display: list-item' elements.
Text-transform application to 'display: run-in' element
  • The 'text-transform' property is applied to 'display: run-in' elements.
Text-transform application to 'display: inline-block' element
  • The 'text-transform' property is applied to 'display: inline-block' elements.
Text-transform application to 'display: table' element
  • The 'text-transform' property is applied to 'display: table' elements.
Text-transform application to 'display: inline-table' element
  • The 'text-transform' property is applied to 'display: inline-table' elements.
Text-transform application to 'display: table-row-group' element
  • The 'text-transform' property is applied to 'display: table-row-group' elements.
Text-transform application to 'display: table-header-group' element
  • The 'text-transform' property is applied to 'display: table-header-group' elements.
Text-transform application to 'display: table-footer-group' element
  • The 'text-transform' property is applied to 'display: table-footer-group' elements.
Text-transform application to 'display: table-row' element
  • The 'text-transform' property is applied to 'display: table-row' elements.
Text-transform application to 'display: table-column-group' element
  • Verifies that text-transform is not applied to 'display: table-column-group' elements.
Text-transform application to 'display: table-column' element
  • Verifies that text-transform is not applied to 'display: table-column' elements.
Text-transform application to 'display: table-cell' element
  • The 'text-transform' property is applied to 'display: table-cell' elements.
Text-transform application to 'display: table-caption' element
  • The 'text-transform' property is applied to 'display: table-caption' elements.
Text-transform and bicameral scripts
  • The text-transform capitalizes a bicameral script.
Text-transform and unicase scripts
  • Verifies that text-transform does not capitalize a unicase script.
16.6 Whitespace: the 'white-space' property
white-space AG
White-space set to 'normal'
  • The 'white-space' property set to 'normal' removes extra spacing when more than one space is next to another.
A
White-space set to 'pre'
  • The 'white-space' property set to 'pre' does not remove extra spacing when more than one space is next to another.
A
White-space set to 'nowrap'
  • The 'white-space' property set to 'nowrap' removes extra spacing when more than one space is next to another. And the text does not wrap when width is constrained.
A
White-space set to 'pre-wrap'
  • The 'white-space' property set to 'pre-wrap' does not remove extra spacing when two spaces are next to each other and introduces line breaking opportunities.
A
White-space set to 'pre-line'
  • The 'white-space' property set to 'pre-line' does remove extra spacing when two spaces are next to each other and breaks at new lines.
A
White-space set to 'inherit'
  • The 'white-space' property set to 'inherit' causes the element to use its parent's white-space value.
A
white-space
  • 'white-space: normal' and 'white-space: nowrap' should collapse sequences of white space. Regarding wrapping, line breaking opportunities are determined on the text prior to white space collapsing steps.
A
white-space - pre and newlines in source
  • Newlines in source must be preserved with 'white-space: pre'
White-space application to 'display: inline' element
  • The 'white-space' property applies to 'display: inline' elements.
A
White-space application to 'display: block' element
  • The 'white-space' property applies to 'display: block' elements.
A
White-space application to 'display: list-item' element
  • The 'white-space' property applies to display: list-item elements.
A
White-space application to 'display: run-in' element
  • The 'white-space' property applies to 'display: run-in' elements.
A
White-space application to 'display: inline-block' element
  • The 'white-space' property applies to 'display: inline-block' elements.
A
White-space application to 'display: table' element
  • The 'white-space' property applies to 'display: table' elements.
A
White-space application to 'display: inline-table' element
  • The 'white-space' property applies to 'display: inline-table' elements.
A
White-space application to 'display: table-row-group' element
  • The 'white-space' property applies to 'display: table-row-group' elements.
A
White-space application to 'display: table-header-group' element
  • The 'white-space' property applies to 'display: table-header-group' elements.
A
White-space application to 'display: table-footer-group' element
  • The 'white-space' property applies to 'display: table-footer-group' elements.
A
White-space application to 'display: table-row' element
  • The 'white-space' property applies to 'display: table-row' elements.
A
White-space application to 'display: table-column-group' element
  • The 'white-space' property is not applied to 'display: table-column-group' elements.
A
White-space application to 'display: table-column' element
  • The 'white-space' property is not applied to 'display: table-column' elements.
A
White-space application to 'display: table-cell' element
  • The 'white-space' property applies to 'display: table-cell' elements.
A
White-space application to 'display: table-caption' element
  • The 'white-space' property applies to 'display: table-caption' elements.
A
White-space and bidirectionality (example from spec)
  • The white space processing model does not take bidi into account for the first half of the processing model but does for the second half.
White-space 'pre-line' vs. ':before' assignment
  • The ':before' assignment and 'white-space: pre-line' assignment behave the same way with respect to white space.
White-space 'nowrap' vs. 'nowrap' attribute
  • The 'nowrap' attribute and 'white-space: nowrap' assignment behave the same way with respect to white space.
White-space 'normal' vs. 'p' element
  • The 'p' element and 'white-space: normal' assignment behave the same way with respect to white space.
White-space 'pre' vs. 'pre' element
  • The 'pre' element and 'white-space: pre' assignment behave the same way with respect to white space.
16.6.1 The 'white-space' processing model
white-space
  • 'white-space: normal' and 'white-space: nowrap' should collapse sequences of white space. Regarding wrapping, line breaking opportunities are determined on the text prior to white space collapsing steps.
A
Block level elements with text and white space
  • Text within a block element is treated like an anonymous inline element for white space processing model.
A
White-space 'normal' with tab adjoining linefeed
  • A tab before a linefeed is removed if 'white-space' is set to 'normal'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'nowrap' with tab adjoining linefeed
  • A tab before a linefeed is removed if 'white-space' is set to 'nowrap'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'pre-line' with tab adjoining linefeed
  • A tab before a linefeed is removed if 'white-space' is set to 'pre-line'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'normal' with carriage return adjoining linefeed
  • A carriage return before a linefeed is removed if 'white-space' is set to 'normal'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'nowrap' with carriage return adjoining linefeed
  • A carriage return before a linefeed is removed if 'white-space' is set to 'nowrap'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'pre-line' with carriage return adjoining linefeed
  • A carriage return before a linefeed is removed if 'white-space' is set to 'pre-line'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'normal' with space adjoining linefeed
  • A space before a linefeed is removed if 'white-space' is set to 'normal'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'nowrap' with space adjoining linefeed
  • A space before a linefeed is removed if 'white-space' is set to 'nowrap'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'pre-line' with space adjoining linefeed
  • A space before a linefeed is removed if 'white-space' is set to 'pre-line'. The linefeed may be rendered as a space or not rendered.
AM
White-space 'pre' with sequence of spaces
  • A sequence of spaces are not collapsed when 'white-space' is set to 'pre'.
A
White-space 'pre-wrap' with sequence of spaces
  • Sequence of spaces are not collapsed when 'white-space' is set to 'pre-wrap'.
A
White-space 'pre-wrap' and line opportunity with sequence of spaces
  • A line breaking opportunity is introduced at the end of a sequence of spaces when 'white-space' is set to 'pre-wrap'.
A
White-space 'normal' and linefeed characters
  • Linefeed characters are transformed into spaces, zero-width space, or not rendered when 'white-space' is set to 'normal'.
AM
White-space 'nowrap' and linefeed characters
  • Linefeed characters are transformed into spaces, zero-width space, or not rendered when 'white-space' is set to 'nowrap'.
A
White-space 'pre' and linefeed characters
  • Linefeed characters are not transformed when 'white-space' is set to 'pre'.
A
White-space 'pre-line' and linefeed characters
  • Linefeed characters are not transformed when 'white-space' is set to 'pre-line'.
A
White-space 'pre-wrap' and linefeed characters
  • Linefeed characters are not transformed when 'white-space' is set to 'pre-wrap'.
A
White-space 'normal' and tabs
  • Tabs are converted to spaces when 'white-space' is set to 'normal'.
A
White-space 'nowrap' and tabs
  • Tabs are converted to spaces when 'white-space' is set to 'nowrap'.
A
White-space 'pre-line' and tabs
  • Tabs are converted to spaces when 'white-space' is set to 'pre-line'.
A
White space processing model with 'space' characters
  • One space with 'white-space' set to 'normal' adjoining a space with 'white-space' set to 'normal' collapse into one space.
A
Two spaces adjoining with 'white-space' 'normal'/'nowrap'
  • One space with 'white-space' set to 'normal' adjoining a space with 'white-space' set to 'nowrap' collapse into one space.
A
Two spaces adjoining with 'white-space' 'normal'/'pre-line'
  • One space with 'white-space' set to 'normal' adjoining a space with 'white-space' set to 'pre-line' collapse into one space.
A
Two spaces adjoining with 'white-space' 'nowrap'/'normal'
  • One space with 'white-space' set to 'nowrap' adjoining a space with 'white-space' set to 'normal' collapse into one space.
A
Two spaces adjoining with 'white-space' 'nowrap'/'nowrap'
  • One space with 'white-space' set to 'nowrap' adjoining a space with 'white-space' set to 'nowrap' collapse into one space.
A
Two spaces adjoining with 'white-space' 'nowrap'/'pre-line'
  • One space with 'white-space' set to 'nowrap' adjoining a space with 'white-space' set to 'pre-line' collapse into one space.
A
Two spaces adjoining with 'white-space' 'pre-line'/'normal'
  • One space with 'white-space' set to 'pre-line' adjoining a space with 'white-space' set to 'normal' collapse into one space.
A
Two spaces adjoining with 'white-space' 'pre-line'/'nowrap'
  • One space with 'white-space' set to 'pre-line' adjoining a space with 'white-space' set to 'nowrap' collapse into one space.
A
Two spaces adjoining with 'white-space' 'pre-line'/'pre-line'
  • One space with 'white-space' set to 'pre-line' adjoining a space with 'white-space' set to 'pre-line' collapse into one space.
A
Two spaces adjoining with 'white-space' 'normal'/'pre'
  • One space with 'white-space' set to 'normal' adjoining a space with 'white-space' set to 'pre' remain two spaces.
A
Two spaces adjoining with 'white-space' 'normal'/'pre-wrap'
  • One space with 'white-space' set to 'normal' adjoining a space with 'white-space' set to 'pre-wrap' remain two spaces.
A
Two spaces adjoining with 'white-space' 'nowrap'/'pre'
  • One space with 'white-space' set to 'nowrap' adjoining a space with 'white-space' set to 'pre' remain two spaces.
A
Two spaces adjoining with 'white-space' 'nowrap'/'pre-wrap'
  • One space with 'white-space' set to 'nowrap' adjoining a space with 'white-space' set to 'pre-wrap' remain two spaces.
A
Two spaces adjoining with 'white-space' 'pre-line'/'pre'
  • One space with 'white-space' set to 'pre-line' adjoining a space with 'white-space' set to 'pre' retain two spaces.
A
Two spaces adjoining with 'white-space' 'pre-line'/'pre-wrap'
  • One space with 'white-space' set to 'pre-line' adjoining a space with 'white-space' set to 'pre-wrap' retain two spaces.
A
White-space 'normal' and space at beginning of line
  • Space at beginning of line is removed when 'white-space' is set to 'normal'.
A
White-space 'nowrap' and space at beginning of line
  • Space at beginning of line is removed when 'white-space' is set to 'nowrap'.
A
White-space 'pre-line' and space at beginning of line
  • Space at beginning of line is removed when 'white-space' is set to 'pre-line'.
A
White-space 'pre-wrap' and space at beginning of line
  • Space at beginning of line is not removed when 'white-space' is set to 'pre-wrap'.
A
White-space 'pre' and space at beginning of line
  • Space at beginning of line is not removed when 'white-space' is set to 'pre'.
A
Tab width
  • Tabs (when rendered) render spaces at 8 character stops. That is, within a line, split the line into 8 character lengths. The tab would continue until the end of the next length. So if there are already 3 characters in a line, the tab would be rendered as 5 spaces.
A
White-space 'normal' and space at end of line
  • Space is removed at the end of the line when 'white-space' is set to 'normal'.
A
White-space 'nowrap' and space at end of line
  • Space is removed at the end of the line when 'white-space' is set to 'nowrap'.
A
White-space 'pre-line' and space at end of line
  • Space is removed at the end of the line when 'white-space' is set to 'pre-line'.
A
White-space 'pre' and space at end of line
  • Space is not removed at the end of the line when 'white-space' is set to 'pre'.
A
White-space 'pre-wrap' and space at end of line
  • Space is not removed at the end of the line when 'white-space' is set to 'pre-wrap'.
A
Floats and line opportunity with 'white-space'
  • A line breaking opportunity is not introduced with floats.
A
Floats and line-breaking opportunities with 'white-space'
  • A line breaking opportunity is not introduced with an absolutely positioned element.
A
White-space 'normal' on a 'pre' element
  • The 'white-space' property set to 'normal' removes extra spacing when two spaces are next to each other when set on 'pre' element.
A
White-space 'nowrap' on a 'pre' element
  • The 'white-space' property set to 'nowrap' does not remove extra spacing when two spaces are next to each other.
A
White-space 'pre-wrap' on a 'pre' element
  • The 'white-space' property set to 'pre-wrap' does not remove extra spacing when two spaces are next to each other and introduces line breaking opportunities when set on a 'pre' element.
A
White-space 'pre-line' on a 'pre' element
  • The 'white-space' property set to 'pre-line' does remove extra spacing when two spaces are next to each other and breaks at new lines when set on a 'pre' element.
A
White space processing model with 'en quad' characters
  • An 'en quad' characters is not collapsed by the white space processing model.
A
White space processing model with 'zero width no break space' character
  • A 'zero width no break space' character is not collapsed by the white space processing model.
A
White space processing model with 'ideographic space' character
  • The 'ideographic space' character is not collapsed by the white space processing model.
A
White-space 'pre-wrap' and tab at end of line
  • A tab at end of line may be removed when 'white-space' is set to 'pre-wrap'.
AM
White-space 'pre-wrap' and space at end of line before following inline element
  • A space at end of line may be removed when 'white-space' is set to 'pre-wrap'.
AM
16.6.2 Example of bidirectionality with white-space collapsing
16.6.3 Control and combining characters' details
Combining characters and styling
  • The combined characters are styled as one character.