| <!DOCTYPE html> |
| <div id="container" style="float:left; height:100px;"> |
| <!-- 1x1 pixel GIF --> |
| <img id="img" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=" style="height:100%;"> |
| </div> |
| <div style="clear:both;"></div> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script> |
| var container = document.getElementById("container"); |
| var img = document.getElementById("img"); |
| test(function() { |
| assert_equals(container.offsetWidth, 100, "container width"); |
| assert_equals(container.offsetHeight, 100, "container height"); |
| assert_equals(img.offsetWidth, 100, "image width"); |
| assert_equals(img.offsetHeight, 100, "image height"); |
| |
| container.style.height = "200px"; |
| assert_equals(container.offsetWidth, 200, "container width"); |
| assert_equals(container.offsetHeight, 200, "container height"); |
| assert_equals(img.offsetWidth, 200, "image width"); |
| assert_equals(img.offsetHeight, 200, "image height"); |
| |
| container.style.height = "100px"; |
| assert_equals(container.offsetWidth, 100, "container width"); |
| assert_equals(container.offsetHeight, 100, "container height"); |
| assert_equals(img.offsetWidth, 100, "image width"); |
| assert_equals(img.offsetHeight, 100, "image height"); |
| }, "STF fixed height, percent height img"); |
| </script> |