header css help needed

Hi,

I am a newbie to css and designing my site at www.theworldschristians.com. I have had a problem where the site looks right in firefox but in IE the header and footer is to the right. I have added display: inline;
as i read to do this on the internet. This fixes the alignment issue but it removes the background colours. Belwo is the css I have for the header. What am I doing wrong?

#header
{
display: inline;
background:#FDF7ED;
height: 120px;
width: 980px;
border-radius:15px;
margin:40px 0px 0px 310px;

}

Thanks in advacned.

Stephen

 

IE is the worst browser on the planet. Inept at best, we all have problems getting modern, working markup to work in it. No one should use IE.

Do not start inserting goofy things like 'inline' to fix IE and wind up screwing up the modern browsers. I don't know that I'll have time to look at this.

EDIT: Remove all those goofy negative margins on all your divs and replace them with 'margin: 0 auto'.

 

Thank you, changing to margin: 0 auto; has helped. the only issue now is i need the site to be lower than it is. Currently the header is right to the top of the page. I had this before by using the margins to push the page down. Is there a way around this?

Thank you again

Steve

 

Your body margin is set to zero. Change that to 'margin: 16px 0 0 0' (or whatever).

 

Bingo. Was what I was going to say. Fiddle with it until it's right.

 

And Bingo was his name-O.

 

Thanks guys, I have got it working right.

 

There is no wrong if you use FF.

It's free.