Gap In IE

[herghost]

Hi all,

 

Wondered if you can help,

 

My page displays fine in chrome/firefox, but in ie there is a gap between my header and navigation divs, it doesnt matter what I have tried I cannot get it to close!

 

Here is my css

#container
{
width: 850px;
margin: auto;
}

#header
{
width: 700px;

}

#header h1 { margin: 0; }

#navigation
{

width: 700px;
background-color: #fff;
margin:auto;
}

#navigation ul
{
margin: 0;
padding: 0;
}

#navigation ul li
{
list-style-type: none;
display: inline;
}

#navigation li a
{
display: block;
float: left;

color: #fff;
text-decoration: none;
border-right: 1px solid #fff;
}

#navigation li a:hover { background: #383; }

#content-container
{

width: 700px;
background-color: #fff;
margin:auto;
}

#content
{
clear: left;
float: left;
width: 518px;
display: inline;
background-color: #fff;
font-family: Arial, Helvetica, sans-serif;
margin:auto;
}

#content h2 { margin: 0; }

#aside
{
float: right;
width: 182px;
display: inline;
background: #fff;
white-space: normal;
margin:auto;

}

#aside h3 { margin: 0; }

#footer
{
clear: left;
text-align: right;
margin:auto;
}

#floater
{
float:left;
width:150px;
text-align:left;
padding-right:850px;

}

 

and how I am using it:

<div id="container">
<div id="header">
	<?php include('header.php');?>
</div>
<div id="navigation">
	<?php include('links.php');?>
</div>

 

Can anyone tell me the problem?

 

There is no <divs> in the include files, and I have tried by emptying the content from both, still shows a gap!

 

Many Thanks

 

 

[haku]

Which IE? They all render differently.

[herghost]

Sorry,

 

IE 8

[haku]

Got a link? If not, you'll need to copy the HTML output of your script and paste that here.

[herghost]

sure,

 

www.simplefinancesolutions.com.au

 

Thanks

 

Also if you can work out why when you hover of the navigation bar a line appears under the bank logos let me know!

 

 

[haku]

You have a lot of errors in your code, you should probably fix those.

 

But I found that changing this:

 

<img width="215" height="9" alt="" src="images/e026_06.jpg" complete="complete"/>

 

to this:

 

<img width="215" height="1" alt="" src="images/e026_06.jpg" complete="complete"/>

 

got rid of the gap.

 

You can turn on developer tools using F12 in IE8 - it's helpful for debugging.

 

 

[herghost]

Sorry haku,

 

I gave you the wrong bloody url, its www.simplefinancesolutions.com.au/newsite/index.php

[herghost]

got it! I had a space before a div tag, I must have hit space intead of tab, d'oh! Many thanks on the ie f12 debugger, did not know it existed!

 

Thanks again