Although my extensive edit to your most might seem to say otherwise, I really do welcome you to WebmasterWorld.
To better understand what my edit is all about, please read this thread: Posting Code [webmasterworld.com]
Also, we do not allow links to sites where the member has any affiliation, even to beta pages. Sorry that it must be this way, but when it is any other way the amount of self promotion on the boards starts to drown out the useful discusion.
All this leaves us where, in terms of your issue?
I notice that you validated both your XHTML and your CSS through the W3C. That's the most important first step to a debug.
So now we need you to help us out. If you zero in on the exact parts of your code that are being mangled by IE 5.5, you are welcome to post short snippets to illustrate the problem. By focusing on the specific area, you will make it possible and easy for the members here to suggest possible solutions.
Problem restated: I am working on a 3 column layout with a header and footer. The design works in IE 6 and NN 6.
However, there are serious display problems with the header in IE 5.5. The text in .hdrlogo displays as a white box.
I am not sure if the problem relates to the css for the three columns. The right and left column are postion: absolute with a % for width. The middle column has no position. All three columns are contained within a <div> with a position: relative.
Here is the header xhtml code: <!-- BEGIN header --> <div class="hdr"> <div class="content"> <div class="clear"></div> <div class="hdrlogo"><span class="logo"> Roscoe L. West Library</span> <span class="tag">at The College of New Jersey</span></div> <div class="hdrlinks"><a title="Library Catalog" href="http://libcat.tcnj.edu/">Library Catalog</a> ¦ <a title="Site Map" href="http://www.tcnj.edu/%7elibrary/sitemap.html">Site Map</a> ¦ <a title="Ask A Librarian" href="http://www.tcnj.edu/%7elibrary/ask.html">Ask A Librarian</a> </div> <div class="clear"></div> </div> </div> <!--END header-->
This particular text is pretty far into a chain of inheritance from multiply nested divs.
The div with class="hdr" contains a nested div with class="content". Then nested inside that div there is another with class="hdr.logo". Then inside that div you have two span tags around the text, each with a different class.
I agree with Longhaired_Genius on this one. The browser code that renders CSS is a fragile thing, and the earlier the browser version, the more fragile it gets.
To avoid confusing the rendering engine, try to simplify the div structure to include as little multiple nesting as possible. This also makes your code much easier to work on in the future.