Html IE7-使用div屏蔽select-select'；s高度被忽略，下拉列表'；s位置太高，超过文本

我使用div作为遮罩，将其设置为绝对位置和z索引1。在它上面，使用z索引2和相对位置，我放置了一个选择

我在IE7中遇到了这段代码，基本上，IE7忽略了select的高度，因此将下拉列表移到了掩码文本上方的过高位置

这是你的电话号码

这是面具
请选择
选择1
选择2
选择3
.面具{
高度：32px；
宽度：200px；
线高：30px；
左侧填充：10px；
位置：绝对位置；
z指数：1；
边框：1px纯灰
}
.选择容器选择{
高度：34px；
宽度：212px；
位置：相对位置；
z指数：2；
排名：0；
不透明度：-1；
过滤器：α（不透明度：-1）；
}

遗憾的是，

select

元素不接受IE7（以及各种其他浏览器/版本）中的设置高度。这是一个类似的例子。你最好的选择是使用其他东西。

我没有回答这个问题，可能是css黑客或其他什么东西。答案是，有点令人失望。

<div class="select-container">
    <div class="mask">This is the mask</div>
    <select>
        <option>Please Select</option>
        <option>option 1</option>
        <option>option 2</option>
        <option>option 3</option>
    </select>
</div><!-- /select_container -->


.mask {
    height: 32px;
    width: 200px;
    line-height: 30px;
    padding-left: 10px;
    position: absolute;
    z-index: 1;
    border: 1px solid grey
}

.select-container select {
    height: 34px;
    width: 212px;
    position: relative;
    z-index: 2;
    top: 0;
    opacity: -1;
    filter: alpha(opacity:-1);
}