ram chml

i tried like this
<div style="overflow:auto;width:300px;" align="left">
<select name="selectedTree" id="selectedTree" multiple size="16" align="left">
</select>
</div>

<div style="overflow-x:scroll;width:300px;" align="left">
<select name="selectedTree" id="selectedTree" multiple size="16" align="left">
</div>

i tried like this it works for options with large text but if the option is having text size small means the select box width got reduced but i want a select box with fixed width for both large(need horizontal scroll bar) and small text.

i want to add a horizontal scroll bar in select box which has fixed width.i tried using overflow:auto; it is not working properly is there any other solution.

i have two select boxes based on the selected value in one select box it should display the maximum options in the other select box.
i used javascript onClick for the first time it displays correct values again when i go back and change the value in the 1st selectbox the 2nd select box display previous values only.it works in all the browsers except opera.
my code is
function CalBasedMaxVal(selVal,changedVal,maxiVal,DefVal)
{
var CalBasedSelValue=selVal.selectedIndex+1;
var defaultText = '-['+lang_text_ary['default']+']';
var optionName;
while (changedVal.options.length)
{
changedVal.remove(0);
changedVal.options[0] = null;
}
for (var i=1; i<=maxiVal; i++)
{
if(i==DefVal)
{
optionName = new Option(i+defaultText, i, false, true);
}
else
{
optionName = new Option(i, i, false, false);
}
changedVal.options[changedVal.length] = optionName;
}
}