IE6 Search Box Button doesn't line up with text input

[ne_plus]

see jpg attachment.

does anyone know a fix for IE6 the css works well in all other browsers for my search form. i have been unable to line up the two elements:

HTML:

<div id="search">
<form method="get" action="http://www.google.com/search">

<input type="checkbox" name="sitesearch"
value="platinumhorsepower.com" style="font:Arial, Helvetica, sans-serif;" checked />
Search Our Site<br />
<input type="text" name="q" size="22.5"
maxlength="100" style="height:22px;" />
<input type="submit" class="submit-button" value=""/>
</form>
</div>



CSS



#search { float: right; width: 195px; margin: 0px 18px; display: inline; }
#search .text { width: 150px; height: 16px; border: 1px solid #ddd; padding: 5px; float: left; color: #888; }
.submit-button {float: right; width: 29px; height: 26px; background-image: url(../images/search.jpg); background-repeat:no-repeat; border:#FFFFFF; background-color:#FFFFFF;background-position: center; cursor:pointer;}

[shotsy247]

adjust the width.

[ne_plus]

adjust the width.

I have adjusted the width but that doesn't seem to work. Also, it makes it look out of place in the rest of the browsers.