IE6's magical expanding div box

[marynorn]

I have a 30px high box containing my navigation bar. As soon as I add the search box, even though the search box and button are less than 30px high, the height of my box doubles.

But only in IE6, of course.

CSS:

#navbar {
	position:relative;
	background-color:#a8a9ad;
	height:30px;
	z-index: 100;
}

HTML:

<div id="navbar"> 
  <ul id="MenuBar1" class="MenuBarHorizontal">
LOTS AND LOTS OF IRRELEVANT NAVIGATION CODE
</ul>
  <div align="right">
  <form action="/pSearch.php" method="get">
   <input name="q" type="text" size="15" />
    <input type="submit" value="Search" />
</form></div>

EDIT: So I changed the div align to p align and the size issue was resolved. Unfortunately, that stopped the search box from aligning correctly in Firefox and Safari. Anyone got fixes for these issues?