I want to create an inline list for a top nav bar so that all of the links sit to the left except for the search box which would be aligned to the right. My problem at the moment is the entire navbar is too wide with the text links on the left vertically aligned in the middle and the search box on the bottom. Here's my coding:

Code:
 #topmenu ul {
 	margin: 0px;
 	padding-left: 3px;
 	list-style: none;
 }
 #topmenu li {
 	float: left;
 	position: relative;
 	margin: 0px;
 	padding: 0px;
 	color: #ffffff;
 }
 #topmenu li.search {
 	float: right;
 }
Code:
 <div id="topmenu">
 	<ul>
 		<li><a href="index.htm">Home</a> |</li>
 		<li><a href="sitemap.htm">Site Map</a> |</li>
 		<li><a href="links.htm">Links</a> |</li>
 		<li><a href="help.htm">Help</a> |</li>
 		<li><a href="feedback.asp">Feedback</a> |</li>
 		<li class="search"><label for="search">Search</label> <input type="text" name="search" /></li>
 	</ul>
 </div>