<!DOCTYPE html>
<style>
    body {
	margin:0;
    }

    #mc {
	-webkit-columns: 3;
	-webkit-column-gap: 20px;
        direction: rtl;
        unicode-bidi: bidi-override;
        -webkit-writing-mode: vertical-lr;
	height: 280px;
	margin:20px 100px;
	font: 20px/1 Ahem;
        background:lime;
    }

    #log {
	position: absolute;
	top: 320px;
    }
</style>
<div id="log">
    <p id="description"></p>
    <div id="console"></div>
</div>
<div id="mc">
    <div>
        <!-- Here's an empty block to trigger wrapping of the sibling text inside an anonymous block. -->
    </div>xxx xxx xxx xxx xxx xxx xxx xxx xxx</div>
<script src="../../../resources/js-test.js"></script>
<script>
    description("Test that hitting an anonymous block child of a multicol container takes us to the right text content.");

    debug("First column:");
    shouldBe("document.caretRangeFromPoint(119,250).startOffset", "3");
    shouldBe("document.caretRangeFromPoint(120,250).startOffset", "7");
    shouldBe("document.caretRangeFromPoint(140,250).startOffset", "11");

    debug("Second column:");
    shouldBe("document.caretRangeFromPoint(119,150).startOffset", "15");
    shouldBe("document.caretRangeFromPoint(120,150).startOffset", "19");
    shouldBe("document.caretRangeFromPoint(140,150).startOffset", "23");

    debug("Third column:");
    shouldBe("document.caretRangeFromPoint(119,50).startOffset", "27");
    shouldBe("document.caretRangeFromPoint(120,50).startOffset", "31");
    shouldBe("document.caretRangeFromPoint(140,50).startOffset", "35");
</script>