src/third_party/WebKit/LayoutTests/fast/regions/shape-inside/shape-inside-on-additional-regions-expected.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <style>
   5     .region {
   6         font: 14px Ahem, sans-serif;
   7         line-height: 16px;
   8         width: 300px;
   9         height: 300px;
  10         margin-top: 10px;
  11         border: 1px solid black;
  12         background-color: yellow;
  13     }
  14     #region_with_shape_inside {
  15         border: 1px solid black;
  16         overflow: hidden;
  17         background-color: orange;
  18     }
  19     #placeholder {
  20         float: left;
  21         width: 50px;
  22         height: 300px;
  23     }
  24 </style>
  25 </head>
  26 <body>
  27
  28 <div class="region">
  29       <p>Despite the passage of time, Major Quilan still suffers grief and bereavement from the death of his wife, killed during the Chelgrian civil war that resulted from the Culture's interference. <p>Quilan is offered the chance to avenge the lost Chelgrians who died in the civil war and is inducted into a plot to strike back at the Culture.</p>
  30 </div>
  31 <div id="region_with_shape_inside" class="region">
  32     <div id="placeholder"></div>
  33     <p>As part of the plot, his <p>"soulkeeper"</p> (a device normally used to store its owner's personality upon their death) is equipped with both the mind of a long-dead Chelgrian general and a device...
  34 </div>
  35
  36 <p>Requires Ahem font. The content - what contains multiple nested paragraphs - flows into multiple regions, a shape-inside property is applied only on the second region. <br/>
  37 The content should start at the top of the second region inside a 200px (width) and 150px (height) rectangle - which has a 50px left offset - then flow into the original container.</p>
  38 <p>Bug <a href="http://webkit.org/b/112177">112177</a>: block children do not layout inline content correctly in a region with shape-inside set</p>
  39
  40 </body>
  41 </html>