在IE中设置SELECT的高度

Question

在渲染HTML SELECT时,IE似乎忽略了CSS中设置的高度.有没有为此工作或我们必须接受IE看起来不如其他浏览器？

Answer 1

除了放弃select元素之外,没有解决方法.

Answer 2

除了放弃select元素之外没有解决方法是正确的,但是如果你只需要在选择列表中显示更多项目,你可以简单地使用size属性:

<select multiple="multiple" size="15">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>

这样做,如果您的项目集合长度小于大小值,您将有额外的空行.

Answer 3

你可以使用font-size和line-height的组合来强制它变大,但显然只有在你需要更大字体的情况下

编辑:

示例 - > http://www.bse.co.nz 编辑:(此链接不再相关)

大搜索框旁边的选择具有以下css规则:

#navigation #search .locationDrop {
    font-size:2em;
    line-height:27px;
    display:block;
    float:left;
    height:27px;
    width:200px;
}

Answer 4

是的你可以.

我能够将我的高度设置为SELECT我想要的IE8和9.诀窍是将box-sizing属性设置为content-box.这样做会将内容区域设置为SELECT高度,但请记住margin,border并且padding不会在宽度/高度中计算SELECT值,因此请相应地调整这些值.

select {
    display: block;
    padding: 6px 4px;
    -moz-box-sizing: content-box;
    -webkit-box-sizing:content-box;
    box-sizing:content-box;
    height: 15px;
}

这是一个有效的jsFiddle.你介意确认和标记适当的答案吗？