Display differences between IE7 and Firefox

[AaronBeau]

I love firefox and sometimes to forget to check my progress in IE. I have started to design a site and I can't figure out why IE is displaying my Navigation so messed up!!!
Does anyone have any ideas?

http://www.184ellicottcreekroad.com/_clients/_dc2/index.php

Here is some of the CSS:
#nav {
background: #ffffff;
padding-bottom: 5px;
border-bottom: 1px solid #000000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size: 11px;
word-spacing: .2em;
position: relative;
width: auto;
height:auto;
}

#nav ul {
border-top: 1px solid #000000;
border-bottom: 2px solid #000000;
padding: 3px 0 1px 3px;
background: #E7ACAC;
list-style-type: none;
z-index: 1000;
width: auto;
height: 16px;
}

#nav ul li {
float: left;
}

#nav a {
display: inline;
color: #000000;
text-decoration: none;
padding: 0pt 5px 0pt 5px;
}

If I change #nav ul height to 'auto' it works in IE but no longer in Firefox.

Also I can't figure out the shift to the right.

Thanks for your help

 

[Vragabond]

I can only see the shift to the right. That happens because FF and IE use different methods to cause the shift of the list element. FF uses padding and IE uses margin. So all you have to do is add margin-left: 0; to your ul element and you should be OK.

I have not noticed any other difference between the browsers.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

 

[AaronBeau]

OMG!!! That was so obvious! Thank you!!

In IE7 I am seeing a line of gray running between the header and the content of the page.