<title>text-decoration</title>
<style>
 *{
     text-decoration-skip-ink: none;
 }
</style>
<h1>text-decoration on a block</h1>

  <u>text directly in parent</u>

  <div><u>text in block</u></div>

  <div style="float:left; clear: left">text in float</div>
  <div style="clear:left"></div>

  <div style="display:inline-block">text in<br>inline-block</div><u>
  </u><div style="display:inline-table">text in<br>inline-table</div>

  <div style="height: 2em">
    <div style="position: absolute">text in abs-pos</div>
  </div>

<h1>text-decoration on an inline</h1>

  <u>text directly in parent</u>

  <div><u>text in block</u></div>

  <div style="float:left; clear: left">text in float</div>
  <div style="clear:left"></div>

  <div style="display:inline-block">text in<br>inline-block</div><u>
  </u><div style="display:inline-table">text in<br>inline-table</div>

  <div style="height: 2em">
    <div style="position: absolute">text in abs-pos</div>
  </div>