blob: c08c92d3603218fdef16c2ad750f1b09d486018e [file] [log] [blame]
<style>
#target { width: 50px; height: 50px; background-color: red; margin: 10px; }
#target:hover { background-color: green; }
</style>
<p>
Test for <i><a href="https://bugs.webkit.org/show_bug.cgi?id=44730">https://bugs.webkit.org/show_bug.cgi?id=44730</a>
Floats inside of multicol fail to hit test</i>.
</p>
<p>
The red square should turn green when hovered.
</p>
<div style="-webkit-columns:2; -webkit-column-fill:auto; columns:2; column-fill:auto; margin: 100; width: 300; height: 200; outline: solid black;">
<div>
<div style="height: 250px; background-color: purple;"></div>
<div style="float: right; background-color: lightyellow; margin: 5px;">
<div id="target"></div>
</div>
</div>
</div>
<div id="result">FAIL: Test did not run.</div>
<script>
if (window.testRunner)
testRunner.dumpAsText();
var result = document.getElementById("result");
var hitElement = document.elementFromPoint(370, 250);
if (hitElement === document.getElementById("target"))
result.innerText = "PASS";
else
result.innerText = "FAIL: Hit " + hitElement;
</script>