parent hidden but children still visible (I don't want them visible)!

Question

Okay, so I had a situation where I needed to add some cloned DOM elements to a parent DIV element in a web page.

I had four of these parent DIV holders. When I make

Answer 1

In some cases you can't use the two solutions suggested here.

E.g. display: none won't work because the element needs to know its width and height when it's rendered while being hidden. visibility: hidden might not work if you don't have control of the children and can't add visiblity:inherit to them.

In those cases you could add opacity: 0 with e.g z-index:-1 to have elements visually hidden (just remember they'll still be there and be clickable etc).