| OLD | NEW | 
 | (Empty) | 
|   1 <!DOCTYPE html> |  | 
|   2 <html> |  | 
|   3 <head> |  | 
|   4 <style> |  | 
|   5     #content { |  | 
|   6         font: 20px Ahem, sans-serif; |  | 
|   7         -webkit-font-smoothing: none; |  | 
|   8         -webkit-flow-into: flow; |  | 
|   9     } |  | 
|  10     .region { |  | 
|  11         width: 300px; |  | 
|  12         height: 300px; |  | 
|  13         background-color: yellow; |  | 
|  14         border-top: 10px solid lightgreen; |  | 
|  15         border-right: 20px solid green; |  | 
|  16         border-bottom: 30px solid lightblue; |  | 
|  17         border-left: 40px solid blue; |  | 
|  18         -webkit-flow-from: flow; |  | 
|  19     } |  | 
|  20     #shape_inside { |  | 
|  21         shape-inside: rectangle(50px, 0px, 200px, 300px); |  | 
|  22         background-color: orange; |  | 
|  23     } |  | 
|  24 </style> |  | 
|  25 </head> |  | 
|  26 <body> |  | 
|  27  |  | 
|  28 <div id="shape_inside" class="region"></div> |  | 
|  29  |  | 
|  30 <div id="content"> |  | 
|  31     XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX |  | 
|  32     XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX |  | 
|  33     XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX |  | 
|  34     XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX |  | 
|  35 </div> |  | 
|  36  |  | 
|  37 <p>Requires Ahem font. The content flows into a region (300px wide) what contain
    s a shape-inside rectangle (200px wide) with 50px left offset.<br/> |  | 
|  38 The content should fill the shape-inside area out. There should be an equally 50
    -50px left and right offset for the content in the content box. The borders shou
    ldn't have any effect on the shape-inside's rectangle. |  | 
|  39 <p>Bug <a href="http://webkit.org/b/115456">115456</a>: [CSS Regions][CSS Exclus
    ions] Shape-inside on regions should respect region borders and paddings</p> |  | 
|  40  |  | 
|  41 </body> |  | 
|  42 </html> |  | 
| OLD | NEW |