third_party/WebKit/LayoutTests/fast/block/positioning/resources/positioned-float-layout-after-image-load-2.html

   1 <html>
   2 <head>
   3 <style type="text/css">
   4   body { margin-left: 10%; margin-right: 10%;}
   5   h1,h2,h3,h4,h5,h6 { text-align: center; clear: both;}
   6   h1 span { display: block; padding-bottom: 0.5em; }
   7   .figcenter   { margin: auto; text-align: center;}
   8   .footnote         {margin-left: 10%; margin-right: 10%; font-size: 0.9em;}
   9   .footnote .label  {position: absolute; float: -webkit-positioned; right: 84%; text-align: right; width: 200px}
  10 </style>
  11
  12 <script>
  13     //   https://bugs.webkit.org/show_bug.cgi?id=54611
  14     //   When navigating to the anchor directly, the anchor should be positioned below
  15     //   the image on first load.
  16
  17     function test(){
  18         var bottomOfImage = document.getElementById("image").offsetTop + document.getElementById("image").offsetHeight;
  19         var footnotePosition = document.getElementById("spantext").offsetTop;
  20         if (footnotePosition >= bottomOfImage)
  21           document.getElementById("console").innerHTML = "SUCCESS";
  22         testRunner.notifyDone();
  23     }
  24 </script>
  25
  26 </head>
  27 <body onload="test();">
  28 <div class="figcenter">
  29   <img id="image" src="icon-gold.png" alt="Book cover." title="">
  30 </div>
  31
  32 <div class="footnote"><a id="anchor1"></a><a href="http://www.gutenberg.org/files/33439/33439-h/33439-h.htm#FNanchor_1"><span id="spantext" class="label">[1]</span></a></div>
  33
  34 <div id="console">FAILURE</div>
  35 </body></html>
  36