span not staying within div in Mozilla

Hello all,

Can anyone help me with this:

http://www.psyclick.34sp.com/home

In IE6 and Opera 7, all is well.

However, in Mozilla 1.4, the 'stuff for prospective clinical psychologists' (in the top right) falls below the top banner, and is overlapped by the navigation column and the main header ('Welcome to psyclick.org.uk')

The banner XHTML is:

<div id="banner">
<a id="top" name="top" />
<span class="left">
 <a href="http://www.psyclick.org.uk/">
 <img src="images/385x60.png" alt="psyclick.org.uk logo" class="logo" />
</a>
 </span>
 <span class="stuff">
  stuff for prospective clinical psychologists
 </span>
</div>

The CSS for those bits is:

#banner
	{
	padding: 0px;
	height: 65px;
	margin: 5px 10px 0 5px;
}

#banner .left {
  float: left;
  text-align: left;
  width: 400px;
}

#banner .stuff {
  float: right;
  text-align: right;
  font-size: 20px;
  font-weight: bold;
  color: #037;
  width: 260px;
}

Here's a small screenshot (15k) in case you are Mozilla-less:

http://www.psyclick.34sp.com/images/moz-prob.png

Any suggestions gratefully received.

Regards,
Ben