使用 IE 在 DIV 中使用 HTML 选择的宽度问题

Question

这是我放在jsfiddle上的一个例子

<div style='width:30px;border:solid 1px'>
  <select style='width:100%'>
    <option>This is my first option</option>
    <option>option</option>
  </select>
</div>

<br/>
<br/>

<div style='width:300px;border:solid 1px'>
  <select style='width:100%'>
    <option>This is my first option</option>
    <option>option</option>
  </select>
</div>

在 IE 7/8 以外的所有浏览器（FF、Chrome、Safari、IE9、IE8 模式下的 IE9）中，第一个组合的选项是完全可见的。IE8 将选项的宽度限制为外部 div 的宽度。

这里有一个

知道如何解决这个问题吗？

Answer 1

添加overflow: hidden;到div的风格和width: auto; float: right;对<select>似乎为我工作。

<div style='width:30px;border:solid 1px; overflow: hidden'>
   <select style='width:auto; float: right;'>
      <option>This is my first option</option>
      <option>option</option>
   </select>
</div>

请参阅http://jsfiddle.net/J7sYq/10/ 上的工作示例