Internet Explorer 8 - Div disappears on resize.

Question

I have a page which works fine in Firefox and Chrome. I.E. 8 however decides to not show a div when the browser is resized. Most of the page looks fine, but the div I am using for the content does not and just disappears when I resize I.E.

<div id="wrapper">
   <div id="innerWrapper" style="width:215px;">
        <div id="mainColumn" style="height:750px; width:600px; float: left; clear:both; position:absolute;">
             <div id="mainContent" style="float:left; ">
                     content here disappears on resize.
             </div>
         </div>
     </div>
</div>

Answer 1

You've been hit by the "haslayout" bug link

The easiest way is to give your wrapper height. A simple hack that works well is height: 1%. this should solve your disappearing div issue.