67 lines
1.8 KiB
HTML
67 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
body {
|
|
}
|
|
nav {
|
|
position: absolute;
|
|
top: 100px;
|
|
width: 400px;
|
|
height: 40px;
|
|
border: 1px solid blue;
|
|
}
|
|
nav > ul {
|
|
float: right;
|
|
list-style: inside;
|
|
}
|
|
nav > ul > li {
|
|
float: left;
|
|
}
|
|
nav > ul > li > a {
|
|
text-decoration: none;
|
|
}
|
|
</style>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
</head>
|
|
<body>
|
|
<nav>
|
|
<ul>
|
|
<li><a href="#">About Us</a></li>
|
|
<li><a href="#">Contact Us</a></li>
|
|
</ul>
|
|
</nav>
|
|
<script>
|
|
if (window.testRunner)
|
|
testRunner.waitUntilDone();
|
|
|
|
var list = document.getElementsByTagName('ul')[0];
|
|
var firstLinkTop = list.firstElementChild.getBoundingClientRect().top;
|
|
var lastLinkTop = list.lastElementChild.getBoundingClientRect().top;
|
|
|
|
if (firstLinkTop == lastLinkTop)
|
|
testPassed('Links are on the same line.');
|
|
else
|
|
shouldBe('firstLinkTop', 'lastLinkTop');
|
|
|
|
window.onload = function() {
|
|
list.style.marginRight = '-10px';
|
|
list.offsetTop;
|
|
list.style.marginRight = 'auto';
|
|
|
|
if (firstLinkTop == list.firstElementChild.getBoundingClientRect().top)
|
|
testPassed('First link didn\'t move after layout.');
|
|
else
|
|
shouldBe('list.firstElementChild.getBoundingClientRect().top', 'firstLinkTop');
|
|
|
|
if (lastLinkTop == list.lastElementChild.getBoundingClientRect().top)
|
|
testPassed('Last link didn\'t move after layout.');
|
|
else
|
|
shouldBe('list.lastElementChild.getBoundingClientRect().top', 'lastLinkTop');
|
|
|
|
if (window.testRunner)
|
|
testRunner.notifyDone();
|
|
};
|
|
</script>
|
|
</body>
|
|
</html> |