<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../resources/js-test.js"></script>
<style>
#test1 { padding: 10px; display: none; }
</style>
</head>
<body>
<div id="tests_container">
<div id="test0" style="display: none"></div>
<div id="test1"></div>
<div id="test2" style="padding: 10px; display: none;"></div>
<table id="test_table" cellpadding="10">
<tr>
<td id="test3" style="display: none">FOO</td>
<td id="test4">BAR</td>
<tr>
</table>
<div style="position: relative; width: 100px; height: 100px">
<div id="test5" style="padding: 10%; width: 50px; height: 50px">BAR</div>
</div>
<div style="position: relative; width: 100px; height: 100px">
<div id="test6" style="display: none; padding: 10%; width: 50px; height: 50px">BAR</div>
</div>
<div style="display: none; position: relative; width: 100px; height: 100px">
<div id="test7" style="padding: 10%; width: 50px; height: 50px">BAR</div>
</div>
</div>
<script>
var test0 = document.getElementById("test0");
var test1 = document.getElementById("test1");
var test2 = document.getElementById("test2");
var test3 = document.getElementById("test3");
var test4 = document.getElementById("test4");
var test5 = document.getElementById("test5");
var test6 = document.getElementById("test6");
var test7 = document.getElementById("test7");
shouldBeEqualToString("window.getComputedStyle(test0, null).paddingTop", "0px");
shouldBeEqualToString("window.getComputedStyle(test1, null).paddingTop", "10px");
shouldBeEqualToString("window.getComputedStyle(test2, null).paddingTop", "10px");
shouldBeEqualToString("window.getComputedStyle(test3, null).paddingTop", "10px");
shouldBeEqualToString("window.getComputedStyle(test4, null).paddingTop", "10px");
shouldBeEqualToString("window.getComputedStyle(test5, null).paddingTop", "10px");
shouldBeEqualToString("window.getComputedStyle(test6, null).paddingTop", "10%");
shouldBeEqualToString("window.getComputedStyle(test7, null).paddingTop", "10%");
// clean up after ourselves
var tests_container = document.getElementById("tests_container");
tests_container.parentNode.removeChild(tests_container);
</script>
</body>
</html>