| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <script src="../resources/subpixel-utils.js"></script> | 4 <script src="../resources/subpixel-utils.js"></script> |
| 5 <script src="../resources/rounded-rectangle.js"></script> | 5 <script src="../resources/rounded-rectangle.js"></script> |
| 6 <script> | 6 <script> |
| 7 window.onload = function () { | 7 window.onload = function () { |
| 8 var stylesheet = document.getElementById("stylesheet"); | 8 var stylesheet = document.getElementById("stylesheet"); |
| 9 generateSimulatedShapeOutsideOnFloat( | 9 generateSimulatedShapeOutsideOnFloat( |
| 10 "float-left", stylesheet.sheet, | 10 "float-left", stylesheet.sheet, |
| 11 { | 11 { |
| 12 'shapeX': 25, 'shapeY': 50, | 12 'shapeX': 25, 'shapeY': 50, |
| 13 'shapeWidth': 75, 'shapeHeight': 100, | 13 'shapeWidth': 75, 'shapeHeight': 100, |
| 14 'shapeRadiusX': 20, 'shapeRadiusY': 20 | 14 'shapeRadiusX': 20, 'shapeRadiusY': 20 |
| 15 }, | 15 }, |
| 16 'left', | 16 'left', |
| 17 10 | 17 10 |
| 18 ); | 18 ); |
| 19 generateSimulatedShapeOutsideOnFloat( | 19 generateSimulatedShapeOutsideOnFloat( |
| 20 "float-right", stylesheet.sheet, | 20 "float-right", stylesheet.sheet, |
| 21 { | 21 { |
| 22 'shapeCenterX': 25, 'shapeCenterY': 50, | 22 'shapeX': 25, 'shapeY': 50, |
| 23 'shapeRadiusX': 50, 'shapeRadiusY': 100 | 23 'shapeWidth': 75, 'shapeHeight': 100, |
| 24 'shapeRadiusX': 20, 'shapeRadiusY': 20 |
| 24 }, | 25 }, |
| 25 'right', | 26 'right', |
| 26 10 | 27 10 |
| 27 ); | 28 ); |
| 28 } | 29 } |
| 29 </script> | 30 </script> |
| 30 <style id="stylesheet"> | 31 <style id="stylesheet"> |
| 31 .container { | 32 .container { |
| 32 font: 10px/1 Ahem, sans-serif; | 33 font: 10px/1 Ahem, sans-serif; |
| 33 width: 200px; | 34 width: 200px; |
| 34 text-align: justify; | 35 text-align: justify; |
| 35 border: 1px solid black; | 36 border: 1px solid black; |
| 36 } | 37 } |
| 37 </style> | 38 </style> |
| 38 </head> | 39 </head> |
| 39 <body> | 40 <body> |
| 40 <h1><a href="https://bugs.webkit.org/show_bug.cgi?id=98676">Bug 112587</a> - [
CSS Exclusions] [CSS Exclusions] shape outside segments not properly calculated
for ellipses</h1> | 41 <h1><a href="https://bugs.webkit.org/show_bug.cgi?id=98676">Bug 112587</a> - [
CSS Exclusions] [CSS Exclusions] shape outside segments not properly calculated
for ellipses</h1> |
| 41 <h2>The vertical black lines in the following box should wrap around the round
ed rectangle on the left and the ellipse on the right</h2> | 42 <h2>The vertical black lines in the following box should wrap around the round
ed rectangles on the left and on the right</h2> |
| 42 <div class="container"> | 43 <div class="container"> |
| 43 <div id="float-left"> | 44 <div id="float-left"> |
| 44 </div> | 45 </div> |
| 45 X X X X X X X X X X | 46 X X X X X X X X X X |
| 46 X X X X X X X X X X | 47 X X X X X X X X X X |
| 47 X X X X X X X X X X | 48 X X X X X X X X X X |
| 48 X X X X X X X X X X | 49 X X X X X X X X X X |
| 49 X X X X X X X X X X | 50 X X X X X X X X X X |
| 50 X X X X X X X X X X | 51 X X X X X X X X X X |
| 51 X X X X X X X X X X | 52 X X X X X X X X X X |
| 52 X X X X X X X X X X | 53 X X X X X X X X X X |
| 53 <div id="float-right"> | 54 <div id="float-right"> |
| 54 </div>. | 55 </div>. |
| 55 X X X X X X X X X X | 56 X X X X X X X X X X |
| 56 X X X X X X X X X X | 57 X X X X X X X X X X |
| 57 X X X X X X X X X X | 58 X X X X X X X X X X |
| 58 X X X X X X X X X X | 59 X X X X X X X X X X |
| 59 X X X X X X X X X X | 60 X X X X X X X X X X |
| 60 X X X X X X X X X X | 61 X X X X X X X X X X |
| 61 X X X X X X X X X X | 62 X X X X X X X X X X |
| 62 X X X X X X X X X X | 63 X X X X X X X X X X |
| 63 X X X X X X X X X X | 64 X X X X X X X X X X |
| 64 X X X X X X X X X X | 65 X X X X X X X X X X |
| 65 X X X X X X X X X X | 66 X X X X X X X X X X |
| 66 X X X X X X X | 67 X X X X X X X X X |
| 67 </div> | 68 </div> |
| 68 </body> | 69 </body> |
| 69 </html> | 70 </html> |
| 70 | 71 |
| OLD | NEW |