List Box with multiple option expands <div>

[Claus Mygind]

I have a <div> which defines my menu bar. I would like for this <div> to stay fixed.

On the menu bar I have a list box.

When the list box is set for single selection, the drop down list of selections, drop below the division.

When I include the "multiple" option on the list box, the list box expands the <div> to the size of the list box's available options.

How can I prevent this from happening? Below is my HTML and css code.

the css code

#MenuBar {
	position: fixed; 
	white-space: nowrap; 
	top: 0px; 
	left: 1px; 
	width: 99%;
	background-color: #CCFFFF; 
	color: black;
	border: #0000FF solid 1px;
	padding-left: 10px;
	z-index: 150;
}

the HTML code

<div id="MenuBar" nowrap="nowrap">
	&nbsp;Soil Samples
	&nbsp;&nbsp;Job#
	<input 
		type="text"
		id="JOBID" 
		name="JOBID" 
		size="7" 
		maxlength="6"
	/>
	&nbsp;
	<input 
		type="button" 
		value="Find Borings"
		onclick="getBoringData();"
	/>
	&nbsp;&nbsp;Select Boring#
	<select 
		id="BORING" 
		name="BORING"
		multiple="multiple"
	>
		<option value="all" selected>Select</option>
		<option value="1"   selected>1</option>
		<option value="2"   selected>2</option>
		<option value="3"   selected>3</option>
		<option value="4"   selected>4</option>
		<option value="5"   selected>5</option>
		<option value="6"   selected>6</option>
		<option value="7"   selected>7</option>
		<option value="8"   selected>8</option>
		<option value="9"   selected>9</option>
		<option value="10"  selected>10</option>
		<option value="11"  selected>11</option>
		<option value="12"  selected>12</option>
		<option value="13"  selected>13</option>
		<option value="14"  selected>14</option>
	</select>
</div>

[drhowarddrfine]

Try floating the drop down.