IE6 lifts divs and crashes columns on a:hover background change

Hi,

I'm developing a CMS to act as the website of the laboratory which I work for, and of all problems I have had this is the strangest. I would like to ask you to browse to the following address and see it yourself:

http://new.oasis-lmc.org/?section=download

I have two divs on top serving as the header and the toolbar and then i have a left-floated static-width column with the navigation and google ads, a right-floated static width column containing images and additional links and then a middle autowidth column (no floating). Below those comes a both-cleared footer div.

Please observe the following which happens if you are using IE6 - when you move your mouse over any of the links in the middle column which point to donwload files (eg. OASIS_DEMO.exe, TIMES_Demo.exe) the background of the link becomes yellow and in this exact moment the footer element goes up to touch the bottom of the middle column, thus crashing the left and the right columns. If you point your mouse over a link in any of the other two columns now - the footer goes again on its place... strange, ha? :) The problem disappears if I remove the background-color property of a:hover..

I have googled with numerous keywords, describing this problem, read so much info on IE6 bugs and backgrounds and background images, and still have no solution for this problem. I appreciate your time and ideas and thank to all of you who spend a minute to see what I'm describing.

have a nice day :)

I add two screenshots illustrating the problem to make it easier to be understood without having to visit the website :)
http://new.oasis-lmc.org/images/IE6before.gif
http://new.oasis-lmc.org/images/IE6after.gif

Try fixing these (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fnew.oasis-lmc.org%2F%3Fsection%3Ddownload) and see what happens.

This seems to be another rendition of the Internet Explorer 6 "peek-a-boo bug". See here: http://www.positioniseverything.net/explorer/peekaboo.html.

The movement problem doesn't occur in Firefox, however the footer div doesn't appear to be located where you intended it to be because Firefox's Adblock is blocking your Google ads. You should keep this in mind since your page design seems to rely on their ads.

Arbitrator - you're the man :)) I knew it had to be a discovered bug in IE^ but couldn't find it.. anywhere.. that's exactly it :) Thanks so much:) I read all on the page you gave me and on a couple more and after I tried all the suggested fixes I kinda redisegned and simplified the site, so that I don't float any divs inside a containing div:) Works perfectly now, Thanks again :)

drhowarddrfine - thanks for reminding me to check after the updates - was really useful :)

Problem solved

Glad to be of assistance. :p