text-decoration-propagation-display-contents.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /css/css-text-decor/text-decoration-propagation-display-contents.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<link rel="help" href="https://drafts.csswg.org/css-text-decor/#line-decoration">

<!--

Note: Line decorations are propagated through the box tree, not through

inheritance, and thus have no effect on descendants when specified on an

element with display: contents.

-->

<link rel="match" href="reference/text-decoration-propagation-display-contents-ref.html">

<body>

<p style="text-decoration: overline; text-decoration-color: #44cc44;">

 <span style="text-decoration: underline; text-decoration-color: red; display: contents">

  <span>Should have</span>

  only overline.

 </span>

</p>

<svg xmlns="http://www.w3.org/2000/svg" width="600" height="100">

 <text style="text-decoration: overline;" y="20">

  <tspan style="text-decoration: underline; display: contents">

   <tspan>Should have</tspan> only overline.

  </tspan>

 </text>

</svg>

<svg xmlns="http://www.w3.org/2000/svg" width="600" height="100"

     xmlns:xlink="http://www.w3.org/1999/xlink">

 <defs>

   <text id="text2" y="20"><tspan>Should have</tspan> no overline.</text>

 </defs>

 <use style="display: contents" text-decoration="underline" xlink:href="#text2" />

</svg>

</body>