IE8cv puzzler: setting zoom:1 via class hides content
===

If the following conditions are met, setting `zoom:1` hides the element's content:

1) Markup must have this structure:

    <table><tr><td>
        <div class="overflow">
            <span class="zoom">zoom</span>
        </div>
    </td></tr></table>

2) These styles must be defined:

    .somethingSPECIAL .zoom {
        zoom: 1;
    }
    .overflow {
        width: 300px;  /* Whatever px here. */
        height: 150px; /* Whatever px here. */
        overflow: auto;
    }

3) The `somethingSPECIAL` class should be applied to any ancestor of the markup above *after* page load (like on a button click).

4) The browser you've been forced to use must be IE8 in Compatibility View.

[Here's a live demo.][1]

Why is this happening, and what can I do to prevent it?  (I can't get rid of `zoom: 1`.  I also have to set the parent class as shown in the demo.)


  [1]: http://jsfiddle.net/GgY6C/5/