html - 使用 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、IE9 in IE8 模式)中，第一个组合的选项是完全可见的。 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/ 中的工作示例