| <html> |
| <head> |
| <style> |
| div { |
| margin: 0px; |
| padding: 0px; |
| border: none; |
| } |
| div.a:after { |
| content: 'This sentence should be after "First." and "Second."'; |
| color: red; |
| } |
| </style> |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| function test(){ |
| var first = document.getElementById("first"); |
| var second = document.getElementById("second"); |
| |
| //Test whether the first and second lines are laid out sequentially. |
| //If there is something between them then it must be the css generated |
| //content which means this bug is not fixed. |
| if(second.offsetTop != first.offsetTop + first.offsetHeight) |
| document.getElementById("result").innerHTML = "FAIL"; |
| else |
| document.getElementById("result").innerHTML = "PASS"; |
| } |
| </script> |
| </head> |
| <body onload="test()"> |
| <p>Bug <a href="https://bugs.webkit.org/show_bug.cgi?id=32288">32288</a> - :after selector displays in wrong place with nested div</p> |
| <div class="a" id="container"> |
| <div id="first">First.</div> |
| <div id="second">Second.</div> |
| </div> |
| <p id="result"></div> |
| </body> |
| </html> |
