Good 'ole Internet Explorer Problems

Question

I'm running into some little glitch on Internet Explorer. The site looks like it should in Firefox (http://i27.photobucket.com/albums/c190/blcArmadillo/FirefoxView.jpg). But when I load it in Internet Explorer the background from my top bar seems to be applied across the site as you can see in this screenshot: http://i27.photobucket.com/albums/c190/blcArmadillo/AfterLoad.jpg. The odd thing is that if I scroll up and down the page, the parts of the page that leave the view of the screen suddenly have the proper white background as you can see in this screenshot: http://i27.photobucket.com/albums/c190/blcArmadillo/AfterScroll.jpg.

The site is temporarily residing at http://evergreenwebdesigns.com/playground/dsite/. If you know how to fix this glitch please let me know. Thanks for your help.

Answer 1

This is the common "hasLayout" IE issue. Check out the fix I suggested for another CSS problem that should work in your case as well.

In your case though you should apply it to IE7 as well, so:

<style>
 .haslayout {
     * display:inline-block; /* Limit to IE7 and below */
 }
</style>

And apply this class to the offending div