third_party/WebKit/LayoutTests/fast/overflow/float-in-relpositioned.html

   1 <style>
   2     .overflow {
   3         width: 100px;
   4         height: 100px;
   5         overflow: auto;
   6         border: 1px solid black;
   7         margin: 10px;
   8     }
   9
  10     .rel {
  11         width: 25px;
  12         height: 25px;
  13         background-color: black;
  14         position: relative;
  15     }
  16
  17     .rel div {
  18         width: 75px;
  19         height: 75px;
  20         background-color: rgba(0, 0, 255, 0.5);
  21     }
  22
  23     .float { float: left; }
  24
  25     .abs { position: absolute; }
  26 </style>
  27
  28 <p>
  29     Test for <i><a href="rdar://problem/6059648">rdar://problem/6059648</a>
  30     Some content not visible when the window is short at courtneyalbright.com</i>.
  31 </p>
  32 <p>
  33     Each black box below should have a scroll bar allowing the blue square to
  34     be scrolled fully into view.
  35 </p>
  36
  37 <div class="overflow">
  38     <div class="rel" style="left: 50px;">
  39         <div class="float"></div>
  40     </div>
  41 </div>
  42
  43 <div class="overflow">
  44     <div class="rel" style="top: 50px;">
  45         <div class="float"></div>
  46     </div>
  47 </div>
  48
  49 <div class="overflow">
  50     <div class="rel" style="left: 50px;">
  51         <div class="abs"></div>
  52     </div>
  53 </div>
  54
  55 <div class="overflow">
  56     <div class="rel" style="top: 50px;">
  57         <div class="abs"></div>
  58     </div>
  59 </div>