src/third_party/WebKit/LayoutTests/fast/regions/overflow-rtl-in-variable-width-regions-expected.html

   1 <!DOCTYPE html>
   2 <html style="direction:rtl">
   3 <link rel="stylesheet" href="resources/region-style.css">
   4 <style>
   5         body { -webkit-font-smoothing: none; font: 16px/1.25 monospace; }
   6
   7     .secondBox {
   8         margin: 40px;
   9         direction: ltr;
  10     }
  11
  12     #region1, #region2, #region3 {
  13         border: 1px solid black;
  14         overflow-y: hidden;
  15     }
  16
  17     #region1 {
  18         width: 200px;
  19         height: 100px;
  20     }
  21
  22     #region2 {
  23         width: 300px;
  24         height: 180px;
  25     }
  26
  27     #region3 {
  28         width: 120px;
  29         height: 120px;
  30     }
  31 </style>
  32 <p style="direction:ltr">The first and last lines of text in the regions below should be clipped to the green box. The overflow
  33 section sizes itself independently in each region.</p>
  34
  35 <div id="container">
  36     <div id="region1">
  37         <div class="overflowContent">
  38             <div class="overflowFirstBox">
  39                 <div class="overflowSecondBox secondBox">
  40                     <div style="width: 500px">Clipped line of text that should not be visible.</div>
  41                     <br/>
  42                     <br/>
  43                 </div>
  44             </div>
  45         </div>
  46     </div>
  47     <div id="region2">
  48         <div class="overflowContent" style="padding-top: 0px;">
  49             <div class="overflowFirstBox" style="border-top-width: 0px;">
  50                 <div class="overflowSecondBox secondBox" style="margin-top: 0px; border-top-width: 0px;">
  51                     <p style="margin-top: 0px;">These lines will not spill out of the regions. These lines will not spill out of the regions.
  52                     These lines will not spill out of the regions.</p>
  53                     <br/>
  54                 </div>
  55             </div>
  56         </div>
  57     </div>
  58     <div id="region3">
  59         <div class="overflowContent" style="padding-top: 0px;">
  60             <div class="overflowFirstBox" style="border-top-width: 0px;">
  61                 <div class="overflowSecondBox secondBox" style="margin-top: 0px; border-top-width: 0px;">
  62                     <div style="width: 500px">Clipped line of text that should not be visible.</div>
  63                 </div>
  64             </div>
  65         </div>
  66     </div>
  67 </div>
  68 </html>