blob: 7e129fc3d71a058071cdd1cd16ee848cad56d0f4 [file] [log] [blame]
<!DOCTYPE html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<style>
#left {
float: left;
width: 500px;
background: rgba(200, 200, 200, 0.8);
margin-right: -100px;
}
#left:hover {
background: rgb(200, 200, 200);
}
#right {
float: right;
width: 400px;
background-color: rgba(0, 128, 0, 0.8);
padding-bottom: 1px;
}
#right:hover {
background: rgb(0, 128, 0);
}
</style>
<div style="width: 800px;">
<div id="left">foo</div>
<div id="right">bar</div>
<div style="height:0px; width:0px; clear:left;"></div>
</div>
<div id="log"></div>
<script>
test(function(t)
{
var rightElement = document.getElementById("right");
var x = rightElement.offsetLeft + 10;
var y = rightElement.offsetTop + rightElement.offsetHeight / 2;
var element = document.elementFromPoint(x, y);
assert_equals(element.nodeName, 'DIV');
assert_equals(element.id, 'right');
}, "elementFromPoint should return the topmost floating element when two floats overlap");
</script>