| OLD | NEW | 
|---|
|  | (Empty) | 
| 1 <!DOCTYPE html> |  | 
| 2 <html> |  | 
| 3 <head> |  | 
| 4 <style> |  | 
| 5     #container { |  | 
| 6         font: 20px Ahem, sans-serif; |  | 
| 7         line-height: 20px; |  | 
| 8         border: 2px solid blue; |  | 
| 9         position: relative; |  | 
| 10         width: 200px; |  | 
| 11         height: 200px; |  | 
| 12         margin-bottom: 60px; |  | 
| 13     } |  | 
| 14     #border { |  | 
| 15         position: absolute; |  | 
| 16         left: 48px; |  | 
| 17         width: 100px; |  | 
| 18         height: 50px; |  | 
| 19         border: 2px solid green; |  | 
| 20     } |  | 
| 21     .spacer { |  | 
| 22         width: 50px; |  | 
| 23         height: 50px; |  | 
| 24     } |  | 
| 25 </style> |  | 
| 26 </head> |  | 
| 27 <body> |  | 
| 28     <div id="container"> |  | 
| 29         <div id="border"></div> |  | 
| 30         <div id="shape-inside"> |  | 
| 31             <div class="spacer" style="float:left"></div> |  | 
| 32             <div class="spacer" style="float:right"></div> |  | 
| 33             X X X X X X |  | 
| 34         </div> |  | 
| 35         <div style="padding-top: 160px;"> |  | 
| 36              X X X X X X X X X X |  | 
| 37         </div> |  | 
| 38     </div> |  | 
| 39     <p>Requires Ahem font. The content should start inside the green rectangle (
    shape-inside) and the overflow should be pushed below the content box (content-b
    ox's margin is blue). <br/> |  | 
| 40     <p>Bug <a href="http://webkit.org/b/114526">114526</a>: [CSS Exclusions] sha
    pe-inside overflow should be pushed to the outside of the content box</p> |  | 
| 41 </body> |  | 
| 42 </html> |  | 
| OLD | NEW | 
|---|