Just finished some lengthy debugging of a layout that was breaking in
all versions of IE I have access to (6, 7 and 8b2). OS is Windows
Vista Business, if that matters.
I figured out how to bypass the issue but not quite sure what to make
of the cause of the error.
The layout is a pretty standard fixed-width with a header, a content
section split into 3 columns, and a footer. Following the 3 columns
in the content section is an IMG. The layout works fine in all
browsers I've tested.
However, if I add a simple class (.red {background-color: red}) to
elements within the #footer via JQuery the three column layout breaks
in the previous containing DIV in all versions of Internet Explorer.
However, I can alter the background-color of #footer elements via css
() method or directly adding the class in the HTML itself and all
remains fine within IE.
If I move the IMG outside the 3 column container, and between the
content DIV and #footer DIV, these IE errors no longer occur.
I'm not sure if this is a bug (known or unknown), but examples can be
seen at:
http://www.sportsamerica.com/testjquery/withJSh2.html
