src/third_party/WebKit/LayoutTests/fast/regions/flow-content-basic-vertical-rl.html

   1 <!DOCTYPE HTML>
   2
   3 <html>
   4 <head>
   5     <link href="resources/region-style.css" rel="stylesheet" type="text/css"/>
   6     <style type="text/css">
   7         html {
   8             -webkit-writing-mode: vertical-rl;
   9             -webkit-font-smoothing: none;
  10         }
  11
  12         #source{
  13             -webkit-flow-into: main-thread;
  14         }
  15
  16         .region {
  17             -webkit-flow-from: main-thread;
  18             width: 100px;
  19             height: 300px;
  20             border: 1px solid black;
  21             padding: 5px;
  22         }
  23     </style>
  24 </head>
  25 <body>
  26     <div id="source" class="pass">
  27         <div style="width:100px;">first flow content</div>
  28         <div style="width:100px;">second flow content</div>
  29     </div>
  30     <div>
  31         The words "flow content" in green should display twice after this div,
  32         and there should be two copies of this content that match.
  33     </div>
  34     <div id="region1" class="region">
  35         <div class="error">FAIL if this text is displayed.</div>
  36     </div>
  37    <div id="region2" class="region">
  38         <div class="error">FAIL if this text is displayed.</div>
  39     </div>
  40     <div>
  41         The words "flow content" in green should display after this div,
  42         and there should be two copies of this content that match.
  43     </div>
  44     <div class="pass">
  45         <p>flow content</p>
  46     </div>
  47
  48     <p>This test checks that content can be redirected to a region. It also
  49      tries out a validation strategy that recreates the intended display
  50      using non-region markup. If top does not match the bottom then the
  51      result should be rejected.</p>
  52 </body>
  53 </html>