| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <script src="../resources/rounded-rectangle.js"></script> | 4 <script src="../resources/rounded-rectangle.js"></script> |
| 5 <script> | 5 <script> |
| 6 function createShapeElement() { | 6 function createShapeElement() { |
| 7 var stylesheet = document.getElementById("stylesheet"); | 7 var stylesheet = document.getElementById("stylesheet"); |
| 8 var dimensions = { width: 700, height: 500, | 8 var dimensions = { width: 700, height: 500, |
| 9 shapeX: 25, shapeY: 45, | 9 shapeX: 25, shapeY: 45, |
| 10 shapeWidth: 600, shapeHeight: 300, | 10 shapeWidth: 600, shapeHeight: 300, |
| 11 shapeRadiusX: 100, shapeRadiusY: 150 }; | 11 shapeRadiusX: 100, shapeRadiusY: 150 }; |
| 12 generateShapeElement("shape-inside", stylesheet.sheet, dimensions, 90); | 12 generateShapeElement("shape-inside", stylesheet.sheet, dimensions, 90); |
| 13 } | 13 } |
| 14 </script> | 14 </script> |
| 15 <style id="stylesheet"> | 15 <style id="stylesheet"> |
| 16 body { margin: 0; } | 16 body { margin: 0; } |
| 17 </style> | 17 </style> |
| 18 </head> | 18 </head> |
| 19 <body onload="createShapeElement()"> | 19 <body onload="createShapeElement()"> |
| 20 <div id="shape-inside"></div> | 20 <div id="shape-inside"></div> |
| 21 <div> | 21 <div> |
| 22 This test requires the Ahem font. It creates a rounded rectangle shape-insid
e and fills it | 22 This test requires the Ahem font. It creates a rounded rectangle shape-insid
e and fills it |
| 23 with alternating black and white squares as inline content. The middle line
overlaps the top | 23 with alternating black and white squares as inline content. The middle line
overlaps the top |
| 24 and bottom rounded corner area. The entire shape-inside should be filled, wi
th a small amount | 24 and bottom rounded corner area. The entire shape-inside should be filled, wi
thout any overflow. |
| 25 of overflow. | |
| 26 </div> | 25 </div> |
| 27 </body> | 26 </body> |
| 28 </html> | 27 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 19865002:
[CSS Shapes] Port shape-inside on regions and shape's content overflow from WebKit (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master