在使用IE的DIV中使用HTML选择的宽度问题 [英] Width issues using HTML select within a DIV using IE

问题描述

这是我输入 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中的IE8)中，第一个组合的选项都是完全可见的. IE8将选项的宽度限制为外部div的宽度.

In every browsers (FF,Chrome,Safari,IE9,IE9 in IE8 mode) other than IE 7/8, the options of the first combo are fully visible. IE8 is limiting the width of the options to the width of the outer div.

这是一个

有什么解决办法吗?

推荐答案

不幸的是，由于与元素行为有关，因此没有CSS解决方案. 因此，我将引导您到另一个来源. http://css-tricks.com/select-cuts- off-options-in-fix/ 当元素被聚焦时，这将改变元素的宽度；而当元素失去聚焦时，将其重新设置.虽然不是很优雅，但是仍然可以看到整个选项. 希望这会有所帮助.

Sadly there is no css solution for this as it relates to the elements behaviour. As such I will direct you to another source. http://css-tricks.com/select-cuts-off-options-in-ie-fix/ This changes the width of the element when it is focused on and sets it back when it loses focus. Not very elegant but still allows the whole option to be seen. Hope this helps.

这篇关于在使用IE的DIV中使用HTML选择的宽度问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！