I’ve overcome the majority of my problems with IE7 and the page layout is correct, but there is one minor issue remaining.
I have a div named main that contains two divs named content and sidebar. It has nothing else in it. The problem is that main has a background colour and borders that aren’t correctly displaying over the entire region because both content and sidebar are floated divs.
I can keep the layout I already have safe by removing the float from sidebar, but then the background and border extend only to the bottom of content in the sidebar, not to the bottom of main. I presume that reversing the float (so that it is on sidebar instead) would have the same issue, ie the background and borders will extend only to the bottom of content.
I could find a way to make it work but at this point I’ve achieved what I set out to do and I’m loathe to waste anymore time on it. The page layout is correct under IE7, so I’ve relegated the background/borders issue with main to the I-don’t-give-a-shit pile.
PS IE7 also has quirks with relative positioning that I didn’t mention here, but had to deal with.
