IE8cv puzzler: setting zoom:1 via class hides content
-
21-06-2021 - |
题
If the following conditions are met, setting zoom:1
hides the element's content:
Markup must have this structure:
<table><tr><td> <div class="overflow"> <span class="zoom">zoom</span> </div> </td></tr></table>
These styles must be defined:
.somethingSPECIAL .zoom { zoom: 1; } .overflow { width: 300px; /* Whatever px here. */ height: 150px; /* Whatever px here. */ overflow: auto; }
The
somethingSPECIAL
class should be applied to any ancestor of the markup above after page load (like on a button click).The browser you've been forced to use must be IE8 in Compatibility View.
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.)
解决方案
I noticed that the width and height of the span element went from 33x19 to 0x0. So if you set it back to 'auto' it works.
$('.zoom').css('width', 'auto');
不隶属于 StackOverflow