On a page where there are elements which are set to display none as the DOMContentLoaded event occurs. Child elements with visibility:visible of a sufficiently distanced (child of child in DOM tree) parent element with visibility:hidden do not display when their display is set to block.
I have made this demo to easily demonstrate the problem.
Toggling the visibility of the root parent from hidden to visible and back to hidden again makes these child elements appear correctly, but only if one or more were set to display block before this toggle. Doing this toggle again after setting them both to display none again breaks the rendering again.
The design that made me boil down a demo page behaves a bit differently, for some reason it allows only one of the two popups to display at any one time. I have created a work around to make it work properly which works by forcing a re-evaluation of visibility. I can demo that slightly different problem if required.
I have tried this on (and got consistent results with):
Webkit Nightly Build for Windows (4.0.5 531.22.7)
Safari for Windows (4.0.4)
Latest Google Chrome Dev for Windows (5.0.342.3)
Latest Google Chrome Stable for Windows (188.8.131.52)
Latest Google Chrome Dev for Ubuntu Linux (5.0.342.1)
I have got working and expected behaviour from:
After receiving an update on this bug via email (having forgotten about it for a long time) I can confirm that the latest versions of Chrome do not show this bug and work properly.
This appears to work in WebKit too now (Chrome forked WebKit, so testing it is not relevant for bugs.webkit.org bugs any more).