text-decoration-087

text-decoration with inline children

WeasyPrint

This browser

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html lang="en">
 3  <head>
 4   <title>CSS Test: text-decoration with inline children</title>
 5   <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch">
 6   <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/text/decoration/007.html" type="text/html">
 7   <link rel="help" href="http://www.w3.org/TR/CSS21/text.html#lining-striking-props">
 8   <style type="text/css">
 9    div { color: orange; text-decoration: underline; }
10    span { vertical-align: bottom; color: gray; }
11    .super { vertical-align: super; }
12    .up { vertical-align: 0.5em; }
13   </style>
14  </head>
15  <body>
16   <p>There should only be one solid orange line under the following
17   text. If the line is broken at any point, or if there are two
18   underlines anywhere, then the test has failed.</p>
19   <div>
20    <span> Test </span>
21    <span class="super"> test test test </span>
22    <span> test </span>
23    <span class="up"> test test </span>
24    <span> test. </span>
25   </div>
26  </body>
27 </html>