image commanding it own line

[freelance84]

Fairly new to CSS so if there is a glaring mistake here I appologise.

 

A centered header contains a logo on the left and some text on the right:

The HTML:

<div id="header">

<a href="index.php"><img style="padding-left:5px;padding-top:3px;" src="png/logo.png" alt="logo" /></a>

<span id="header-inner">$u_name -<br/>Account -<br/><a href="logout.php">Log Out</a> -</span>

</div>

 

The CSS

#header {
width: 700px;
margin-right:auto;
margin-left:auto;
background-image: url(png/top-gradient.png);
background-repeat: repeat-x;
}
#header-inner{
float: right;
width: 100px;
font-size: small;
font-weight: bold;
color: #EEEEEE;
text-align: right;
padding-right: 15px;
padding-top: 4px;
}

 

The result in FF and Chrome is a header with my logo inside on the left and the span inside the header on the right.

 

When I checked if it working in ie6, the span and contents keeps going under the line in which the image is on.

 

Any ideas?

 

Is there some css I should be applying to the img tag enabling them to sit on the same line as other stuff?

 

Any help here would be very much appreciated.

 

 

PS:

When I take out the image, the span tag will quite happily sit in the header

[haku]

<div id="header">
<span id="header-inner">$u_name -<br/>Account -<br/><a href="logout.php">Log Out</a> -</span>

<a href="index.php"><img style="padding-left:5px;padding-top:3px;" src="png/logo.png" alt="logo" /></a>


</div>

[freelance84]

Hmm, nice one, cheers. Can't belive thats all it needed!