<!DOCTYPE HTML>
<html>
<head>
    <script>
        if (window.testRunner)
            testRunner.dumpAsText(true);
    </script>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <p>Test 'text-underline-position: alphabetic' with vertical-align. The
    horizontal lines should cross the 'p' letter in word 'ipsum'. None of the
    numbered texts are vertically aligned and the horizontal lines should
    follow the respective baseline of each text, that is, there should be six
    horizontal lines, one for each text, and none of them should be aligned.
    Bugzilla link: http://webkit.org/b/102795.</p>

    <div class="alphabetic">
        <p>&nbsp;1 lorem ipsum&nbsp;&nbsp;
            <span style="vertical-align: 3em;">&nbsp;2 lorem ipsum&nbsp;&nbsp;</span><span style="vertical-align: -2em;">&nbsp;3 lorem ipsum&nbsp;&nbsp;</span><br>
            &nbsp;4 lorem ipsum&nbsp;&nbsp;
            <span style="vertical-align: middle">&nbsp;5 lorem ipsum&nbsp;&nbsp;<span style="vertical-align: middle">&nbsp;6 lorem ipsum&nbsp;&nbsp;</span></span>
        </p>
    </div>
</body>
</html>
