CSS improvements in IE7 - nobody said it was going to be easy...
Boy... Monday was the sort of day that I don't want to have to go through again any time soon.
As we all know, IE7 has been 'layout complete' since the March release, but, as the last few days have shown, sometimes things can go wrong.
Check out how my site looked in IE7B2 - nasty, yes?
IE-VISTA as displayed in IE7 Beta 2 before the CSS was fixed
Such embarrassment - one of the premier IE7 sites, if not *the* premier IE7 site, could not be viewed in IE7 Beta 2. Even more embarrassing, it was an IE Program Manager at Microsoft who first spotted the problem and let me know.
Unfortunately I was travelling on the day of the Beta 2 release, heading back to Canberra from Wagga after spending a few days at Code Camp 2006 and my wireless broadband CDMA modem was only delivering 12Kb - I was hardly able to do anything. And, it was the Anzac Day holiday in Australia.
I don't know enough about CSS to be able to fix this, but thankfully I have lots of knights in shining armour around me who were willing to assist.
Brian Madsen, MVP knocked up a quick hack that improved the situation a little - note how we have gone from an overlap problem to the left column content falling off to the far left - well, at least its readable.
IE-VISTA as displayed in IE7 Beta 2 and IE6 after the first attempted fix
Brian kept working on the problem but couldn't get it fixed. Dave at Microsoft was still online (despite it being quite late for him) and was testing various attempts to fix the problem as they were uploaded - no joy.
Dave, Bob and Marcus at Microsoft really went to bat to try and help get the site fixed as quickly as possible. From what I understand, Bob and Marcus basically dropped everything to concentrate on working out what went wrong, and how to resolve the issue. And I tell ya what.. they came through for me.
By the time I awoke on the Tuesday morning there was an email in my inbox with a snippet of code that the guys at Microsoft thought might fix the problems at www.ie-vista.com. It did fix the problem in IE7 Beta 2 but some issues still remain in IE6 and earlier.
IE-VISTA as it appears now in IE6 and earlier - note the missing content in the left column.
So far, we have not been able to work out why the content is missing in the left pane - the required space has been allocated, but some of the content is missing. Thankfully the navigation menu itself is still there albeit off screen in the above shot.
Ok, so where do we go from here? Well, I'll be moving away from Frontpage over the next week or so to an ASP solution, using Visual Studio instead of FrontPage to build and maintain my site. I have also advised the owner of Ruthsarian Layouts of the problem, but as of yet have not received a response. I've also been trying to get in touch with site authors that I know are using the same CSS templates from Ruthsarian so that they can also apply the fixes that have been used on www.ie-vista.com.
My grateful thanks go to Brian Madsen, MVP as well as Dave Massy, Bob and Marcus at Microsoft for dropping everything to help get www.ie-vista.com fixed.
Oh yes... I should tell you what caused the problem. There is a known bug that sometimes hits when CSS uses negative margins. That's what got me. I don't pretend to understand the mechanics of the problem, but will try and get specifics for those who are interested.