Alternative to using HTML Select

I have a HTML form with various SELECT (both multiline and drop down list style) elements. A number of the items in开发者_如何学C the SELECT are much wider than the element width. In most browsers it will display a tooltip and the drop down will be as wide as the widest option. In IE6 however neither of these work.

Does anyone know any alternative control, such as a jQuery plugin, that can be used as a SELECT replacement that will allow tooltips and wider drop down. It only needs to work in IE6.

You could use CSS to specify a width for the SELECT element that caters to your need.

select { width: 150px; }

How about something along the lines of jQuery Selectable.

Here you get a selectable list of elements with a given width. If you want something closer to a select menu (ie everything isn't listed out), you could take a look into a drop-down menu type implementation, and modify it to select your value instead of navigating to a new page.

I don't have IE6, so I'm not 100% if you can set the width of a select element. If you can't, you could just 'recreate' a select element. I wouldn't be surprised if IE6 had some issue with it.

For example, create a display: inline-block div for each option, then loop through each div and get the highest width. Loop through again and set each width to the highest width. Keep these in one unique container (with the same width to ensure they wrap) and position them next to an element created for this purpose. Not sure how practical it is for your application, but heh.

To elaborate, this is what I meant: http://jsfiddle.net/Svkxc/