IE adds gap in fixed layout

[luthierbytrade]

Hi-

I can't seem to figure out why my fixed layout looks wrong in IE.

The page is here:

http://www.radfordsda.org/

and the CSS is here:

http://www.radfordsda.org/textpattern/css.php?s=default

--
The site seems fine in most recent browsers except IE on PC. It adds a gap between the top header and the body. None of the other browsers I've checked do this.

Any suggestions?

 

[BillyRayPreachersSon]

The URL

http://www.radfordsda.org/

simply times out. Are you sure it is correct?

Dan


The answers you get are only as good as the information you give!

 

[Vragabond]

I couldn't reach the page as well but would just like to ask you if you are using a complete and valid doctype. Not having one could cause IE to misbehave (even more than it usually does).

 

[luthierbytrade]

Wouldn't you know as soon as I send in a thread my webserver would get hacked. I waited until they got things up again before posting again. I sure hope it doesn't go down again while you try accessing it.
Thanks for trying.

Vragabond...you may recognize this site. I had trouble with the links in IE MAC. I've decided to not worry about that one since IE MAC is a dead horse now and it appears there's no fix for that. But the gap between the header and body eludes me.

 

[Vragabond]

Your website crashed again while I was working on it. The main reason for the weird behaviour was [tt]position: fixed;[/tt] in your #header style. That property is not correctly identified by IE and that is why IE mocked up. BTW, did you really want to have it fixed? Fixed means that it hovers at the same place in the viewport while scrolling. To see the effect, open the page in a Gecko browser, make the window really small and scroll. Header will always be on the page and will hover over other elements. If you remove everything but the width and height from header and subsequently remove margin-top: 90px from #wrapper, you should be more or less ok.

#header {
	background-image: url(../imgs/watercolor.jpg);
	height: 115px;
	width: 100%;
}

I have been saying this a lot lately but I will stress it again. Don't try to do stuff that is way over your head. You have so many things in your stylesheet and I am pretty sure you don't know what all of it is doing. You're solving simple errors by implementing more errors which will eventually make your site completely impossible to maintain.