Have Geek Brain

CSS: Removing a class with visibility: hidden / position: absolute not showing in IE6 / 7

I have the following CSS class:

.hidden {
    visibility: hidden;
    position: absolute;
}

I have a div with this class on it. If I remove the class, the div won't show. But the second time when I "remove it" the div shows. Any idea why? To do this, use a stand-alone example using YUI:

http://avernet.googlepages.com/ie-visibility.html (code also available on Pastie )

Note. I cannot use display: none

in my case (which would have worked otherwise).

0


a source to share


3 answers


Using the IE juggling technique does the trick. I've added some more information on this wiki: find the title Cell content remains hidden in IE .

And here is the nudge implementation that we use in the Orbeon Forms code:



/**
 * Nudge element after a short delay for IE6/7 to force IE to "do the right thing".
 */
nudgeAferDelay: function(element) {
    if (YAHOO.env.ua.ie != 0 && YAHOO.env.ua.ie <= 7) {
        window.setTimeout(function() {
            element.className = element.className;
        }, ORBEON.util.Utils.getProperty(INTERNAL_SHORT_DELAY_PROPERTY));
    }
}
0


a source


Do you mean display: none

instead of visibility: hidden

?



+1


a source


It looks like it has something to do with "position: absolute;". If you remove this line it works, or if you add

div { position:absolute; }

it also works.

0


a source






More articles:


All Articles