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

   1 <!DOCTYPE HTML>
   2 <html>
   3 <head>
   4     <style>
   5         #content {
   6             font: 20px Ahem, sans-serif;
   7             -webkit-font-smoothing: none;
   8         }
   9
  10         #region1 {
  11             width: 180px;
  12             height: 100px;
  13             border: 1px solid green;
  14             margin-top: 10px;
  15         }
  16         #region2 {
  17             width: 300px;
  18             height: 150px;
  19             border: 1px solid green;
  20             margin-top: 60px;
  21         }
  22         #region3 {
  23             width: 300px;
  24             height: 50px;
  25             border: 1px solid green;
  26             margin-top: 60px;
  27         }
  28         #placeholder1 {
  29             float: right;
  30             width: 60px;
  31             height: 100px;
  32         }
  33         #placeholder2 {
  34             float: right;
  35             width: 80px;
  36             height: 150px;
  37         }
  38     </style>
  39 </head>
  40 <body>
  41 <div id="content">
  42     <div id="region1">
  43         <div id="placeholder1"></div>
  44         X X X X X X X X X X X X X X X
  45     </div>
  46     <div id="region2">
  47         <div id="placeholder2"></div>
  48         X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X
  49     </div>
  50     <div id="region3">X X X X X X X X X X X X X X X</div>
  51 </div>
  52
  53 <p>Requires Ahem font. Two different -shape-inside property are applied to the first and second region. The third region is a simple region without -shape-inside.
  54     The inline content should flow through the regions and the shape-insides should be applied to the first two regions thus the content should be only 130px wide in the first (original width: 180px) and only 220px wide in the second (original width: 300px) region.</p>
  55 <p>Bug <a href="http://webkit.org/b/115456">115456</a>: [CSS Regions][CSS Exclusions] Shape-inside on regions should respect region borders and paddings</p>
  56 </body>
  57 </html>