<!DOCTYPE HTML> <html> <head> <!-- Test that before/after generated content stops suppression correctly, both statically and dynamically --> <style> body > div { border:1px solid black; margin:1em; font-family:sans-serif; letter-spacing:2px; } #d1:before { content:"Hello"; } #d2:after { content:"Kitty"; } #d3.c:before { content:"Hello"; } #d4.c:after { content:"Kitty"; } </style> <script> function loaded() { document.body.offsetHeight; document.getElementById("d3").setAttribute("class", "c"); document.getElementById("d4").setAttribute("class", "c"); } </script> </head> <body onload="loaded()"> <div id="d1"> <span>Kitty</span></div> <div id="d2"><span>Hello</span> </div> <div id="d3"> <span>Kitty</span></div> <div id="d4"><span>Hello</span> </div> </body> </html>