Bizarre behaviour related to iframes

Question

In our project, we dynamically generate pages, and for that we use iframes in iframes. (I know, generally bad idea, but it is a really old project)

The bizarre behaviour is the following:

There is an iframe, which should be hidden, and for that we use display:none; When a specific button is pressed, it should remove this display:none part, and it does it. However, the iframe does not appear. (for other iframes, this behaviour works perfectly)

The bizarre part comes in, when I (in Chrome) search in the Element selection of the development tools for the specific Id for the iframe, (I kid you not) it suddenly appears on the webpage.

Does anyone has any idea why it doesn't appear, and what kind of update the element search does to it to make it appear?

Thanks

Answer 1

setting display: none; will stop browser from loading the iframe's content, even if you later make it display block, then the iframe element will be there but it won't fetch data from network.

try this position: absolute; left: -5000px; or use js to refresh iframe after its set to display block