inline-offsetLeft-relpos.html | Explore in Territory

<!DOCTYPE html>
<style>
    .relpos {
        position: relative;
        padding-left: 5px;
    }
    .pad {
        border: 10px solid yellow;
        padding-left: 3px;
    }
</style>
<script src="../../resources/check-layout.js"></script>

<div id="container">
    XX

    <span class=relpos>
        <span class=pad data-offset-x="5">XX</span>
    </span>

    <span class=relpos>
        <span class="pad" style="display: inline-block;">
            <div data-offset-x="18">XX</div>
        </span>
    </span>

    <span class=relpos>
        <span data-offset-x="5" class="pad" style="position: absolute">XX</span>
    </span>

    <span class=relpos>
        <span data-offset-x="50" class="pad" style="position: absolute; left: 50px">XX</span>
    </span>
</div>

<script>
    checkLayout("#container");
</script>

chromium/third_party/blink/web_tests/fast/inline/inline-offsetLeft-relpos.html