Expanding Select box

Question

Hi All,

I was just wondering if anyone out there knows of a way to have a dropdown/select box set to a fixed width i.e. 125px, but when you open it, the dropdown portion will automatically expand to the largest item in the list, and when you select the item, have the dropdown resize back to the 125px size?

It does it in FF but no currently in IE.

Thanks in advance, B

Answer 1

you can set the width with css using width: 125px.

Not sure if you can control the width of the popup part, but this will normally automatically resize, up to some arbitary limit.

Answer 2

To achieve the effect you are after, I think you'd need to use either some CSS 3 properties (which won't work in all browsers) or more likely some Javascript.

You could use the onFocus and onBlur events of the select box, and then update the style.width property accordingly. Let me know if you'd like some code samples!