When does IE7 recompute styles? Doesn't work reliably when a class is added to the body.

Posted by Kid A on Stack Overflow See other posts from Stack Overflow or by Kid A
Published on 2010-03-16T22:19:05Z Indexed on 2010/03/16 22:21 UTC
Read the original article Hit count: 347

Filed under:
|
|
|

I have an interesting problem here. I'm using a class on the element as a switch to drive a fair amount of layout behavior on my site.

If the class is applied, certain things happen, and if the class isn't applied, they don't happen. The relevant CSS is roughly like this:

.rightSide { display:none; }
.showCommentsRight .rightSide { display:block; width:50%; }
.showCommentsRight .leftSide { display:block; width:50%; }

And the HTML:

<body class="showCommentsRight">
    <div class="container"></div>
        <div class="leftSide"></div>
        <div class="rightSide"></div>
    </div>
    <div class="container"></div>
        <div class="leftSide"></div>
        <div class="rightSide"></div>
    </div>
    <div class="container"></div>
        <div class="leftSide"></div>
        <div class="rightSide"></div>
    </div>
</body>

I've simplified things but this is essentially the method. The whole page changes layout (hiding the right side in three different areas) when the flag is set on the body. This works in Firefox and IE8. It does not work in IE8 in compatibility mode. What is fascinating is that if you sit there and refresh the page, the results can vary. It will pick a different section's right side to show. Sometimes it will show only the top section's right side, sometimes it will show the middle.

I have tried a validator (to look for malformed html), double css formatting, and making sure my IE7 hack sheet wasn't having an effect.

So my question is: * Is there a way that this behavior can be made reliable? * When does IE7 decide to re-do styling?

Thanks everyone.

© Stack Overflow or respective owner

Related posts about css

Related posts about internet-explorer