| <!DOCTYPE html> |
| <html> |
| <head> |
| <style id='stylesheet'> |
| div { |
| font: 50px/1 Ahem, sans-serif; |
| color: green; |
| } |
| p { |
| margin: 0; |
| } |
| </style> |
| <script src='../resources/simple-rectangle.js'></script> |
| <script> |
| window.onload = function() { |
| createRectangleTestResult('shape-inside1', 'stylesheet', { width: 200, height: 200 }, { x: 50, y: 50, width: 100, height: 100 }, 'px', '<p>XX</p><p>XX</p>'); |
| createRectangleTestResult('shape-inside2', 'stylesheet', { width: 200, height: 200 }, { x: 50, y: 50, width: 100, height: 100 }, 'px', '<p>XX</p><p>XX</p>'); |
| }; |
| </script> |
| </head> |
| <body> |
| <p>This test requires the Ahem font. It tests that dynamically set shape-insides should affect their block's children. You should see two green squares inside blue outlines.</p> |
| <div id='shape-inside1'></div> |
| <div id='shape-inside2'></div> |
| </body> |
| </html> |