third_party/WebKit/LayoutTests/fast/images/percent-height-image.html

   1 <!DOCTYPE html>
   2 <script>
   3     if (window.testRunner) {
   4         testRunner.waitUntilDone();
   5         testRunner.dumpAsText();
   6     }
   7
   8     function check() {
   9         var expected = 20;
  10         var actual = document.querySelector("img").offsetHeight;
  11         var out = document.querySelector("pre");
  12         if (actual == expected)
  13             out.textContent = "PASS";
  14         else
  15             out.textContent = "FAIL: image height was " + actual + " expected " + expected;
  16         testRunner.notifyDone();
  17     }
  18 </script>
  19 <div>
  20     Tests that an image with height 100% inside a floated div keeps its intrinsic height.<br/>
  21     See Bug: http://bugs.webkit.org/show_bug.cgi?id=45439</div>
  22 <div style="float: left;">
  23     <!-- src is a 20 x 20 PNG -->
  24     <img style="height: 100%; width: 100%;" onload="check()" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAMAAAC6V+0/AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMAUExURQ//W/8AAP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAPzdRA4AAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjLX7mlDAAAAaUlEQVQoU23QQQ4AIQgDQPD/j5ZSCkYlxsPoSlnzT5mvu8yBjoPcULaAYG60RFxrDHsQVshvY6URsw8WjY2isnuZ3lTfudn5NEVFYmbN0BjWcYWVpU44kbKc2Hbg2KBMMyC85ph/HfipDQwyAn26rjFKAAAAAElFTkSuQmCC"/>
  25 </div>
  26 <pre></pre>