| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| .region { -webkit-flow-from: foo; } |
| |
| #container { |
| font: 20px/1 Ahem; |
| width: 100px; |
| height: 100px; |
| background-color: green; |
| } |
| |
| #container::before { |
| content: "AAAAA"; |
| display: block; |
| } |
| |
| #container::after { |
| content: "AAAAA"; |
| display: block; |
| } |
| </style> |
| </head> |
| <body> |
| <p>Test that the pseudo-elements children of a region are properly laid out after the region becomes an ordinary element.</p> |
| <p>On success, you see a green rectangle with a black stripe on top.</p> |
| <div id="container" class="region"></div> |
| <script> |
| document.body.offsetTop; |
| document.getElementById("container").className = ""; |
| </script> |
| </body> |
| </html> |