IE adding margin, can't find where!

[generic]

Hi all,

I'm working on a layout right now and it's looking great in Firefox. But in IE7 it's adding a margin (or a padding) between div#content and div#nav and I can't for the life of me find out where it's coming from and it's blowing the whole layout. Any thoughts would be much appreciated.

Here's the layout:
<snip>

Here's the relevant code:

HTML:

<div id="content">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus.</p>
</div>
<div class="clear"></div>
<hr class="hide" />
<div id="nav">
<ul>
<li><a href="index.php">HOME</a></li>
<li><a href="services.php">SERVICES</a></li>
<li><a href="company.php">COMPANY IDEOLOGY</a></li>
<li><a href="bio.php">BIO</a></li>
<li><a href="contact.php">CONTACT</a></li>
</ul>
</div>

CSS:

#content {
overflow: auto;
float: left;
width: 655px;
height: 280px;
margin-bottom: 20px; }
#nav li {
display: inline;
list-style-type: none;
padding-right: 20px; }

[edited by: swa66 at 9:46 pm (utc) on July 22, 2009]
[edit reason] No links, please see ToS and Forum Charter [/edit]

[generic]

Ahh yes, no links sorry, although it does make it extremely difficult to describe the problem... I'll keep that in mind for the future though.

I've narrowed down the problem to the #nav section. When I delete the div#nav altogether, the spacing goes to where it should be. When I have the div#nav in place, IE adds a ~130px margin to the top of the div... strange.

[generic]

Ok sorted it out. I had to add display: inline to the div#nav which seems odd but it worked so I'm a happy camper. Thanks to anyone who looked anyway.