CSS Text Decoration Module Level 3 CR Test Suite

Line Decoration: Underline, Overline, and Strike-Through (114 tests)

Test Refs Flags Info
+ 2 Line Decoration: Underline, Overline, and Strike-Through
ruby-text-decoration-01 = text-decoration on rubies
text-decoration-001-manual text-decoration underline
  • text-decoration:underline; there is a line at or under the alphabetic baseline
text-decoration-002-manual text-decoration overline
  • text-decoration:overline; there is an overline
text-decoration-003-manual text-decoration line-through
  • text-decoration:line-through; there is a solid line through the centre of the characters
text-decoration-004-manual text-decoration underline overline
  • text-decoration:underline overline; there is an overline and an underline
text-decoration-040-manual text-decoration underline tbrl hor scripts
  • text-decoration:underline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: vertical-rl
text-decoration-040a-manual text-decoration underline tbrl mixed
  • text-decoration:underline; there is an unbroken line to the LEFT of the characters for each lines
text-decoration-041-manual text-decoration underline tbrl (zh)
  • text-decoration:underline; there is a line to the LEFT of the characters
text-decoration-044-manual text-decoration overline tbrl hor scripts
  • text-decoration-line:overline; there is a line to the RIGHT of the characters for horizontal scripts set vertically using writing-mode: vertical-rl
text-decoration-045-manual text-decoration overline tbrl (zh)
  • text-decoration-line:overline; there is a line to the RIGHT of the characters
text-decoration-046a-manual text-decoration overline tbrl mixed
  • text-decoration-line:overline; there is an unbroken line to the RIGHT of the characters for all lines
text-decoration-048-manual text-decoration line-through vertical-rl
  • text-decoration:line-through; there is a solid vertical line through the centre of the characters
text-decoration-048a-manual text-decoration line-through vertical-rl hor scripts
  • text-decoration:line-through; there is a solid vertical line through the centre of the characters
text-decoration-049-manual text-decoration vertical-rl over+under
  • text-decoration:underline overline; there is a vertical line on both sides of the characters
text-decoration-082-manual text-decoration underline overline tblr
  • text-decoration:underline overline; there is a line on both sides of the characters
text-decoration-085-manual text-decoration line-through tblr
  • text-decoration:line-through; there is a solid vertical line through the centre of the characters.
text-decoration-090-manual text-decoration underline sideways-rl
  • text-decoration:underline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-090a-manual text-decoration underline sideways-rl non-Latin
  • text-decoration:underline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-091-manual text-decoration overline sideways-rl
  • text-decoration:overline; there is a line to the RIGHT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-091a-manual text-decoration overline sideways-rl non-Latin
  • text-decoration:overline; there is a line to the RIGHT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-092-manual text-decoration line-through sideways-rl
  • text-decoration:line-through; there is a line through the CENTRE of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-092a-manual text-decoration line-through sideways-rl non-Latin
  • text-decoration:line-through; there is a line through the CENTRE of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-095a-manual text-decoration underline sideways-lr non-Latin
  • text-decoration:underline; there is a line to the RIGHT of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-096-manual text-decoration overline sideways-lr
  • text-decoration:overline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-096a-manual text-decoration overline sideways-lr non-Latin
  • text-decoration:overline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-097-manual text-decoration line-through sideways-lr
  • text-decoration:line-through; there is a line through the CENTRE of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-097a-manual text-decoration line-through sideways-lr non-Latin
  • text-decoration:line-through; there is a line through the CENTRE of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-line-001-manual text-decoration-line underline
  • text-decoration-line:underline; there is a line at or under the alphabetic baseline
text-decoration-line-002-manual text-decoration-line overline
  • text-decoration-line:overline; there is an overline
text-decoration-line-003-manual text-decoration-line line-through
  • text-decoration-line:line-through; there is a solid line through the centre of the characters
text-decoration-line-004-manual text-decoration-line underline overline
  • text-decoration-line:underline overline; there is an overline and an underline
text-decoration-line-040-manual text-decoration-line underline tbrl hor scripts
  • text-decoration-line:underline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: vertical-rl
text-decoration-line-040a-manual text-decoration-line underline tbrl mixed
  • text-decoration-line:underline; there is an unbroken line to the LEFT of the characters for each lines
text-decoration-line-041-manual text-decoration-line underline tbrl (zh)
  • text-decoration-line:underline; there is a line to the LEFT of the characters
text-decoration-line-044-manual text-decoration-line overline tbrl hor scripts
  • text-decoration-line-line:overline; there is a line to the RIGHT of the characters for horizontal scripts set vertically using writing-mode: vertical-rl
text-decoration-line-045-manual text-decoration-line overline tbrl (zh)
  • text-decoration-line-line:overline; there is a line to the RIGHT of the characters
text-decoration-line-046a-manual text-decoration-line overline tbrl mixed
  • text-decoration-line-line:overline; there is an unbroken line to the RIGHT of the characters for all lines
text-decoration-line-048-manual text-decoration-line line-through vertical-rl
  • text-decoration-line:line-through; there is a solid vertical line through the centre of the characters
text-decoration-line-048a-manual text-decoration-line line-through vertical-rl hor scripts
  • text-decoration-line:line-through; there is a solid vertical line through the centre of the characters
text-decoration-line-049-manual text-decoration-line vertical-rl over+under
  • text-decoration-line:underline overline; there is a vertical line on both sides of the characters
text-decoration-line-082-manual text-decoration-line underline overline tblr
  • text-decoration-line:underline overline; there is a line on both sides of the characters
text-decoration-line-085-manual text-decoration-line line-through tblr
  • text-decoration-line:line-through; there is a solid vertical line through the centre of the characters.
text-decoration-line-090-manual text-decoration-line underline sideways-rl
  • text-decoration-line:underline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-line-090a-manual text-decoration-line underline sideways-rl non-Latin
  • text-decoration-line:underline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-line-091-manual text-decoration-line overline sideways-rl
  • text-decoration-line:overline; there is a line to the RIGHT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-line-091a-manual text-decoration-line overline sideways-rl non-Latin
  • text-decoration-line:overline; there is a line to the RIGHT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-line-092-manual text-decoration-line line-through sideways-rl
  • text-decoration-line:line-through; there is a line through the CENTRE of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-line-092a-manual text-decoration-line line-through sideways-rl non-Latin
  • text-decoration-line:line-through; there is a line through the CENTRE of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-line-095-manual text-decoration-line underline sideways-lr
  • text-decoration-line:underline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-rl
text-decoration-line-095a-manual text-decoration-line underline sideways-lr non-Latin
  • text-decoration-line:underline; there is a line to the RIGHT of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-line-096-manual text-decoration-line overline sideways-lr
  • text-decoration-line:overline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-line-096a-manual text-decoration-line overline sideways-lr non-Latin
  • text-decoration-line:overline; there is a line to the LEFT of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-line-097-manual text-decoration-line line-through sideways-lr
  • text-decoration-line:line-through; there is a line through the CENTRE of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-line-097a-manual text-decoration-line line-through sideways-lr non-Latin
  • text-decoration-line:line-through; there is a line through the CENTRE of the characters for horizontal scripts set vertically using writing-mode: sideways-lr
text-decoration-propagation-01 = text-decoration shouldn't propagate through 'svg' element
  • An outer 'svg' element is an atomic inline-axis element, so text decorations must not propagate through it.
text-decoration-propagation-dynamic-001 = Dynamic text-decoration propagation
text-underline-position-019-manual text-underline-position auto
  • text-decoration:underline; text-underline-position:auto; the underline is placed at or under the alphabetic baseline, unless the script works better with a line further from the baseline
text-underline-position-020-manual text-underline-position under
  • text-decoration:underline; text-underline-position:under; the underline is low enough to avoid crossing the descenders
text-underline-position-021-manual text-underline-position under left
  • text-decoration:underline; text-underline-position:under left; the underline is low enough to avoid crossing the descenders
text-underline-position-022-manual text-underline-position under right
  • text-decoration:underline; text-underline-position:under right; the underline is low enough to avoid crossing the descenders
text-underline-position-071-manual text-underline-position tbrl auto vertical-rl
  • text-decoration:underline; text-underline-position:auto; the underline is placed alongside the characters, and may or may not cross any descenders
text-underline-position-072-manual text-underline-position under vertical-rl
  • text-decoration:underline; text-underline-position:under; the line is far enough away to avoid crossing any descenders
text-underline-position-073-manual text-underline-position left vertical-rl
  • text-decoration:underline; text-underline-position:left; the line is to the left of the characters for all lines
text-underline-position-074-manual text-underline-position under left vertical-rl
  • text-decoration:underline; text-underline-position:under left; the line is to the left of the characters for all lines
text-underline-position-075-manual text-underline-position right vertical-rl
  • text-decoration:underline; text-underline-position:right; the line is to the right of the characters for all lines
text-underline-position-076-manual text-underline-position under right vertical-rl
  • text-decoration:underline; text-underline-position:under right; the line is to the right of the characters for all lines
+ 2.1 Text Decoration Lines: the text-decoration-line property
line-through-vertical =
text-decoration-line =
text-decoration-line-010 = text-decoration-line - none
  • This test checks that 'text-decoration-line: none' does not produce any text decoration.
text-decoration-line-011 = text-decoration-line - underline
  • This test checks that 'text-decoration-line: underline' produces an horizontal line under the text (underlined).
text-decoration-line-012 = text-decoration-line - overline
  • This test checks that 'text-decoration-line: overline' produces an horizontal line over the text.
text-decoration-line-013 = text-decoration-line - line-through
  • This test checks that 'text-decoration-line: line-through' produces an horizontal line through the middle of the text.
text-decoration-line-014 AnimatedOptional text-decoration-line - blink
  • This test checks that 'text-decoration-line: blink' blinks (alternates between visible and invisible).
text-decoration-line-recalc =
+ 2.2 Text Decoration Style: the text-decoration-style property
text-decoration-style-computed Script getComputedStyle().textDecorationStyle
  • text-decoration-style computed value is as specified.
text-decoration-style-invalid Script Parsing text-decoration-style with invalid values
  • text-decoration-style supports only the grammar 'solid | double | dotted | dashed | wavy'.
text-decoration-style-multiple =
text-decoration-style-recalc =
text-decoration-style-valid Script Parsing text-decoration-style with valid values
  • text-decoration-style supports the full grammar 'solid | double | dotted | dashed | wavy'.
text-underline-position-computed Script getComputedStyle().textUnderlinePosition
  • text-underline-position computed value is as specified.
text-underline-position-invalid Script Parsing text-underline-position with invalid values
  • text-underline-position supports only the grammar 'auto | [ under || [ left | right ] ]'.
text-underline-position-valid Script Parsing text-underline-position with valid values
  • text-underline-position supports the full grammar 'auto | [ under || [ left | right ] ]'.
+ 2.3 Text Decoration Color: the text-decoration-color property
text-decoration-color = CSS3 text-decoration-color
text-decoration-color-computed Script getComputedStyle().textDecorationColor
  • Computed text-decoration-color is the computed color.
text-decoration-color-invalid Script Parsing text-decoration-color with invalid values
  • text-decoration-color supports only the grammar '<color>'.
text-decoration-color-recalc =
text-decoration-color-selection-001 = CSS3 text-decoration-color when |::selection| exists
text-decoration-color-selection-002 CSS3 text-decoration-color when |::selection| exists
text-decoration-color-selection-pseudo-01 = CSS3 text-decoration-color when |::selection| and another pseudo style exists
  • When selected, text decorations apply the selection color when other pseudo styles are present
text-decoration-color-valid Script Parsing text-decoration-color with valid values
  • text-decoration-color supports the full grammar '<color>'.
+ 2.4 Text Decoration Shorthand: the text-decoration property
text-decoration-computed Script getComputedStyle().textDecoration
  • text-decoration computed value is as specified.
text-decoration-serialization.tentative Script text-decoration shorthand serialization
text-decoration-invalid Script Parsing text-decoration with invalid values
  • text-decoration supports only the grammar '<&#8216;text-decoration-line&#8217;> || <&#8216;text-decoration-style&#8217;> || <&#8216;text-decoration-color&#8217;>'.
text-decoration-shorthand Script CSS Text Decoration: text-decoration sets longhands
  • text-decoration supports the full grammar '<&#8216;text-decoration-line&#8217;> || <&#8216;text-decoration-style&#8217;> || <&#8216;text-decoration-color&#8217;>'.
text-decoration-valid Script Parsing text-decoration with valid values
  • text-decoration supports the full grammar '<&#8216;text-decoration-line&#8217;> || <'text-decoration-thickness'> || <&#8216;text-decoration-style&#8217;> || <&#8216;text-decoration-color&#8217;>'.
+ 2.5 Text Underline Position: the text-underline-position property
text-decoration-subelements-001 Test case for text-decoration with subelements
  • for underlines and overlines the UA must use a single thickness and position on each line for the decorations deriving from a single decorating box
text-decoration-subelements-002 = Test case for text-decoration with subelements
  • for underlines and overlines the UA must use a single thickness and position on each line for the decorations deriving from a single decorating box
text-decoration-subelements-003 = Test case for text-decoration with subelements
  • line decorations, if any, are added to the element
text-decoration-underline-position-horizontal =
text-decoration-underline-position-vertical =
text-decoration-underline-position-vertical-ja =
text-underline-position-alphabetic-001 Ahem text-underline-position - alphabetic
  • This tests checks that there is underline in a position to cross the descenders.
text-underline-position-auto-001 Ahem text-underline-position - auto
  • This tests checks that there is underline under the baseline.
text-underline-position-left-001 Ahem text-underline-position - left
  • This tests checks that there is underline in a position under the descenders.
text-underline-position-left-002 Ahem text-underline-position - left in vertical writing mode
  • This tests checks that there is underline to the left of the text in vertical writing mode.
text-underline-position-right-001 Ahem text-underline-position - right
  • This tests checks that there is underline in a position under the descenders.
text-underline-position-right-002 Ahem text-underline-position - right in vertical writing mode
  • This tests checks that there is underline to the right of the text in vertical writing mode.
text-underline-position-under-001 Ahem text-underline-position - under
  • This tests checks that there is underline in a position under the descenders.
underline-font-size-vlr-003 'text-decoration: underline' with various font sizes
  • This test checks that when mongolian glyphs of varying font sizes are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box.
underline-font-size-vlr-005 'text-decoration: underline' with various font sizes and mixed text
  • This test checks that when latin and mongolian glyphs of varying font sizes are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box.
underline-font-size-vrl-002 'text-decoration: underline' with various font sizes
  • This test checks that when east-asian glyphs of varying font sizes are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box.
underline-font-size-vrl-004 'text-decoration: underline' with various font sizes and mixed text
  • This test checks that when latin and east-asian glyphs of varying font sizes are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box.
underline-mixed-vlr-003 'text-decoration: underline' and mixed text
  • This test checks that when latin and mongolian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box.
underline-mixed-vrl-002 'text-decoration: underline' and mixed text
  • This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box.