| <!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> |