View Full Version : Shrinking Divs in IE6 (fine in FF)

07-18-2007, 05:20 PM
I am working on a "blog"-type project for different committees of the University I am working for. The "blog" allows the various committees to post updates on the status of their committee. All the posts for a particular academic year are listed on one page. (The actual posts are stored in a MySQL database and retrieved with PHP).

The project is nearly complete except for a disturbing visual problem in IE6. On pages that have multiple posts on them, the div container that holds posts is repeated for each post. In Firefox these containers appear correctly. In IE6, the containers get thinner (ie: the width seems to shrink) with each repetition, until the text begins to bleed out of the container on both sides. Obviously since a decent number of people still use IE6 this is unacceptable.

I have run W3C validators on both my XHTML and CSS and both validate. I have visually checked my XHTML, CSS, PHP, and even the contents of my database multiple times to look for errors and can't find anything that would cause this.

At this point I do not know what else to check. If anyone could give me any suggestions it would be GREATLY appreciated.

You can see an example of the problem here: https://webapptst.lasalle.edu/stu_affairs/tbae/archive.php?id=1&year=2004&m=1

07-18-2007, 07:24 PM
Hmm remove any whitespace before your doctype including blank lines. Anything above the doctype will cause IE6 to go into quirks mode causing it to render some things incorrectly. If that doesn't work then look into the box model problem.

Using an XHTML Strict doctype seems to fix the problem.

07-18-2007, 08:02 PM
Thanks for the reply :)

I actually came back to post that I have found a solution to the problem.

After doing some reading I realized that the problem could be related to the "hasLayout" property in Internet Explorer. The "post" DIV I was using had no width or height defined so might "have a layout." To set "hasLayout" to true I set a height: 1% on the post DIV and the problem disappeared. :)

More information can be found here:


07-18-2007, 08:12 PM
Rather than use a hack you can use a strict doctype and the problem is also fixed.