Select in IE not resizing automatically [Archive] - HTML Forums

View Full Version : Select in IE not resizing automatically

dasaxena

08-03-2005, 02:54 PM

Hi

I have a problem in using Select control. I have given it a style :width 120

but the size of the option strings are greater than that.
In Firefox when i click on the select it automatically resizes it to the largest size of the option string, but in IE it does not

can some one explain how to accomplish this ??

thanx
deepak

_Aerospace_Eng_

08-03-2005, 02:56 PM

So you are trying to make it expand but yet you set a width to it? What is the point for setting a width to the select if its going to expand byitself anyways to fit the largest option?

dasaxena

08-03-2005, 03:00 PM

I have set the width to 120 coz that is the size of my table column.

what i want to accomplish is the size of the select when clicked should show the options in expanded form on top of any other control ...............
i dont want to resize the select completely .... i just want the user to be able to see all the option strings in entireity

thanx

_Aerospace_Eng_

08-03-2005, 03:08 PM

Sighs, then don't generate such long options. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
select {
width:120px;
}
</style>
</head>

<body>
<select name="theselect" onfocus="this.style.width='400px';this.style.position='absolute';" onblur="this.style.width='120px';this.style.position='relative';">
<option>this is an option</option>
<option>this is an even longer option</option>
<option>this is a very long option in which will not fit in the select.</option>
</select>
</body>
</html>

dasaxena

08-03-2005, 03:13 PM

i dont think my question is clear

the size of the select remains the same........ the size of the options increases on click .....

try this example in both IE and Firefox to see the difference.....

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
select {
width:120px;
}
</style>
</head>

<body>
<select name="theselect">
<option>this is an option</option>
<option>this is an even longer option</option>
<option>this is a very long option in which will not fit in the select.</option>
</select>
</body>
</html>

_Aerospace_Eng_

08-03-2005, 03:19 PM

I understand what you are saying but IE doesn't behave this way, so you need to make it behave this way, nothing you can do. FF is not IE nor is IE FF. The select changes back to its normal state when the user clicks off it. It shouldn't effect your layout at all because its absolutely positioned onfocus so the elements ignore it, you can try onmouseover but onmouseout won't work because IE only reads the mouseout on the first option then it changes back.