How To Fix Header floating out of position in IE7 & IE6?

[Edding]

Hi Guys,

I have set up an example page here:

http://www.wpexperiments.com/test.html

The only problem comes with IE7 and IE6, the green div is being pushed to the far right and towards the bottom.

The main objective is to create a layout like this that causes the left column to come up first in the source code, then the second column and then the header thus contents what is in the green div and then finally the footer div.

Any ideas and suggestions to get IE to work as it should is very much appreciated!

Everything validates also, so it’s not related to a validation error.

Thanks in advance!

[deepak.webtenet]

Just add this to your css: #top{ top:0px;left:0px;} and your new css will be:
#top{
position:absolute;
top:0px;
left:0px;
z-index:2;
width:960px;
height:135px;
background:#287f33;
background-position:top;
}

and you are done.
Cheers!! :)

[Edding]

Thanks Deepak!

It does work for IE7 and IE8, but unfortunately IE6 sill shows a problem.

[Author]

Posts