src/third_party/WebKit/LayoutTests/fast/regions/positioned-objects-block-static-in-rtl-regions.html

   1 <!doctype html>
   2 <html style="direction:rtl">
   3 <head>
   4  <style>
   5     #content {
   6         -webkit-flow-into: flow1;
   7     }
   8
   9     #first-box {
  10         margin:10%
  11     }
  12
  13     #second-box {
  14         position:absolute;
  15         top:0;
  16         bottom:0;
  17         width:160px;
  18         background-color:green
  19     }
  20
  21     #region1, #region2, #region3 {
  22         border: 1px solid black;
  23         -webkit-flow-from: flow1;
  24     }
  25
  26     #region1 {
  27         width: 200px;
  28         height: 150px;
  29     }
  30
  31     #region2 {
  32         width: 300px;
  33         height: 180px;
  34     }
  35
  36     #region3 {
  37         width: 120px;
  38         height: 120px;
  39     }
  40 </style>
  41 </head>
  42
  43 <body>
  44 <p style="direction:rtl">The green positioned object should only be as tall as the first region it
  45 is contained in. It should be centered in the first region, and no red
  46 should be visible.</p>
  47
  48 <div id="content">
  49     <div id="first-box">
  50         <div style="width:100px;height:100px;background-color:red"></div>
  51         <div id="second-box">
  52
  53         </div>
  54     </div>
  55 </div>
  56
  57 <div id="container">
  58     <div id="region1"></div>
  59     <div id="region2"></div>
  60     <div id="region3"></div>
  61 </div>