<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<script>
if (window.testRunner)
testRunner.dumpAsText();
</script>
<body style="margin-left:10px; margin-top:15px;">
<!-- Make a container with 9 lines. With three columns, that means three lines per column. -->
<div style="-webkit-columns:3; columns:3; column-gap:1em; -webkit-column-gap:1em; width:32em; orphans:1; widows:1;">
<br>
<br>
<br>
<br>
<br>
<span id="elm">
<!-- This is at a column boundary, where the first line fits in the second column, while
the second line is in the third column. -->
XXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXX
</span><br>
<br>
<br>
</div>
<script>
var rects = document.getElementById('elm').getClientRects();
shouldBe("rects.length", "2");
shouldBeGreaterThan("rects[1].left", "rects[0].left");
shouldBeGreaterThan("rects[0].top", "rects[1].top");
shouldBeGreaterThan("rects[0].right - rects[0].left", "0");
shouldBe("rects[1].right - rects[1].left", "rects[0].right - rects[0].left");
shouldBeGreaterThan("rects[0].bottom - rects[0].top", "0");
shouldBe("rects[1].bottom - rects[1].top", "rects[0].bottom - rects[0].top");
</script>
</body>