text-underline-offset-vertical-002-ref.html

Enable keyboard shortcuts

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>Reference case for text-underline-offset</title>

    <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />

    <style>

        div{

            font: 20px/1 Ahem;

            margin-left: 5em;

        #text{

            color: transparent;

            writing-mode: sideways-lr;

            text-decoration: green underline;

            text-decoration-skip-ink: none;

            text-underline-offset: 0;

            margin-left: 5em;

    </style>

</head>

<body>

    <p>Test passes if the underline is further to the right of the text</p>

    <div>

        <p>XXXX</p>

        <span id="text">XXXXX</span>

    </div>

</body>

</html>