views:

391

answers:

2

Hi friends,

How to expand drop down list (listed items). I cant able to view the listed items in IE while i restricted the size of the drop down list.

Please run this code in IE and other browsers - u can see the difference

<html><body><select style='width:20px;'><option>sdfffffffffffffffffffffffffffffffffffffff</option><option>sdfffffffffffffffffffffffffffffffffffffff</option><option>sdfffffffffffffffffffffffffffffffffffffff</option><option>sdfffffffffffffffffffffffffffffffffffffff</option><option>sdfffffffffffffffffffffffffffffffffffffff</option><option>sdfffffffffffffffffffffffffffffffffffffff</option>

And please tell me what are the style's can use in drop down to make it good

+1  A: 

yeah, in IE if you give a select box a fixed width, it does not resize to fit the content when clicked.

There are a few hacks and workarounds for it,

One of those is to change the width of the select box when it is clicked, then when it's unclicked put it back to the original size.

This might work for showing the content, but it could often break the layout of the site or make it look odd.

Something like this could work,

<select name="selectName" onclick="this.style.width = '120px';" 
        onblur="this.style.width = '20px';">
Sir David of Lee
+1  A: 

This is having some issue. In IE If while click on the drop down will expand and it collapse immediatly. This is happening if the drop down is not on the focuss. Once the drop down get the focuss it is working fine.

Sujith