computed-style-percentage-top-with-position-inline.html

<!DOCTYPE html>
<span id='outer' style="display:inline; position:relative; font:20px Ahem; border:10px solid red; margin:20px; padding:30px;">
    outer
    <div id='inner' style="position:absolute; top:50%; background:blue">inner</div>
</span>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script>
  test(()=> {
    var inner = document.querySelector("#inner");
    var computedStyle = window.getComputedStyle(inner, null);
    assert_equals(computedStyle.getPropertyValue('top'), "40px");
  }, "Percentages should be resolved");
</script>

chromium/third_party/blink/web_tests/fast/css/getComputedStyle/computed-style-percentage-top-with-position-inline.html