<!DOCTYPE html>
<div id="target" style="
outline: dashed lightblue;
width: 400px;
-webkit-columns: 2;
-webkit-column-gap: 0;
columns: 2;
column-gap: 0;
column-fill: auto;
height: 90px;
font: 20px Ahem;
">Lorem ipsum dolor sit amet consectetur elit.</div>
<p id="result">
FAIL: Test did not run.
</p>
<script>
if (window.testRunner)
testRunner.dumpAsText();
// Clicking below the last line in the first column should not select anything from the first
// line on the second column.
var target = document.getElementById("target");
var hitOffset = document.caretRangeFromPoint(target.offsetLeft + 45, target.offsetTop + 87).startOffset;
document.getElementById("result").innerText = hitOffset === 26 || hitOffset === 24 ? "PASS" : "FAIL: hit offset " + hitOffset + ".";
</script>