After searching on Google and looking on numerous forums I can't seem to find a good solution which works the way I want.

I have a select box which is a set width. Some of the text in the dropdown list is longer than the set width. In Firefox / Chrome the width of the dropdown will expand to display all the text, and thats exactly how I want it. However, in IE7 the width of the dropdown will not expand. I do not want to resize the select box itself as it will mess up the look of the page.

I know this is an issue with IE but was wondering is there any solution, or can anyone point me in the direction of a solution. See attachments on a simple example to see what I mean. I'm sure there must be some fix for this, maybe JavaScript. Any ideas would be great.

Here is some simple code used in the screenshots
<select id="list" style="width:100px;">
  <option value="text1">Some text</option>
  <option value="text2">Some longer text</option>
  <option value="text3">Some even longer text</option>