Cross Browser Problems

[mitchrenton]

I think im close to pulling my hair out! could somebody please take a look at th e following site and tell me why its just not working in IE please!!

mitch.kustard.com

mitch.kustard.com/style.css

[Wickham]

You have used position: fixed which is not supported by IE6 so that will need editing.

The #content div shows further right in IE7 than in Firefox so that needs correcting. I can make it the same as Firefox by changing position: fixed to position: absolute and changing margin-left to left:-
#content {
position: absolute;/*fixed;*/
background: #E1E1E1 url(images/call_me_bob.jpg)
no-repeat bottom;
width: 385px;
height: 400px;
/*margin-*/left: 232px;
padding-top: 15px;
}
#slideshow {
position:absolute;/*fixed;*/
width: 212px;
height: 456px;
background: url(images/slideshow.jpg);
/*margin-*/left: 638px;
}

However, that was just a quick fix and I expect that there are other edits required. Position: absolute divs should have a top position as well as a left position.

Make the viewing window smaller and scroll. The footer covers the bottom of your content at small window resolutions initially and scrolls up when you scroll, leaving space underneath showing the rest of the content below it, because it has position: absolute; bottom: 0; so it is stuck to the window bottom at small resolutions but moves up with a scroll. Give this a top position instead of a bottom position and it will stay in its place below the content div.