By duntuk on

I just installed IE7 final last night, and had to fix a bunch of sites so they display correctly in IE7...

The one fix that solved the majority of display issues is applying a "min-height:" to the divs that are giving you problems...

e.g. 

#content { min-height: 200px; }

so yeah, IE7 understands 'min-height' ... and the "holy hack" .clearfix doesn't seem to be breaking anything in IE7... yet....

http://www.positioniseverything.net/articles/poll/star-html.php

Comments

Caleb G2’s picture

Caleb G2 commented

Who are mac-bound and don't have a working copy of IE7...

This site will let you test and preview your own site with many different browsers, including IE7.

=====

Drupal hosting

bryansd’s picture

bryansd commented

Thanks for that link. That has to be one of the coolest non-Drupal links I've seen posted here in a long time. What a great development tool!

-Bryan
CMSReport

duntuk’s picture

duntuk commented

yeah, that is useful...

I was going to mention that you can download a standalone version of IE 6sp1 and other previous versions...

http://browsers.evolt.org/?ie/32bit/standalone

however... just a note... conditional comments will not work with standalones... since even though you're using a previous standalone version, if you hit "about" it will show the latest INSTALLED version (which would be IE 7 in my case) and that's what IE uses to interpret what CSS to use...

e.g. this code says, to use a stylesheet "iehacks.css" if your browser is Less Than IE7.. so it will be used by IE 6, 5.5. , 5.0, etc.... however you won't be able to test this with the standalone, so that link (http://v03.browsershots.org/) would really come in handy, thanks ...

<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="iehacks.css" />
<![endif]-->

read more here: http://en.wikipedia.org/wiki/Internet_Explorer

btw....

here's an updated version of the "Holy Hack" to fix IE7 problem... note the min-height:1%;

/* clear fix */
/* --------------------- */

.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-table; min-height:1%;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */