| <!DOCTYPE html> |
| <link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org"> |
| <link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=534751"> |
| <style> |
| .cell > div { background:white; } |
| </style> |
| <p>No red should be seen below.</p> |
| <div id="multicol" style="columns:2; column-fill:auto; gap:0; height:70px; width:200px; line-height:20px;"> |
| <div style="position:relative; display:table; border-spacing:10px;"> |
| <div class="cell" style="display:table-cell; width:30px; background:red;"> |
| <div id="child1">1<br></div> |
| <div id="child2">2<br></div> |
| <div id="child3">3<br></div> |
| <div id="child4">4<br></div> |
| <div id="child5">5<br></div> |
| </div> |
| </div> |
| </div> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script> |
| test(() => { |
| assert_equals(document.getElementById("child1").offsetLeft, 10); |
| assert_equals(document.getElementById("child1").offsetTop, 10); |
| assert_equals(document.getElementById("child1").offsetHeight, 20); |
| assert_equals(document.getElementById("child2").offsetLeft, 10); |
| assert_equals(document.getElementById("child2").offsetTop, 30); |
| assert_equals(document.getElementById("child2").offsetHeight, 20); |
| assert_equals(document.getElementById("child3").offsetLeft, 10); |
| assert_equals(document.getElementById("child3").offsetTop, 50); |
| assert_equals(document.getElementById("child3").offsetHeight, 20); |
| assert_equals(document.getElementById("child4").offsetLeft, 110); |
| assert_equals(document.getElementById("child4").offsetTop, 0); |
| assert_equals(document.getElementById("child4").offsetHeight, 20); |
| assert_equals(document.getElementById("child5").offsetLeft, 110); |
| assert_equals(document.getElementById("child5").offsetTop, 20); |
| assert_equals(document.getElementById("child5").offsetHeight, 20); |
| }, "Table with border spacing"); |
| </script> |