IE下拉界限

Question

我正在修復與CSS的下拉界限問題。 它對我來說工作得很好。我正在使用下拉箭頭。 此下拉列表在ie7和ie6中不可見。 我附上了一張圖片。

我試着減少了濾鏡可見的不透明度：對於ie7，但是使文本消失。我可以修復它嗎？

需要幫助使其在ie7中可見。

<style type="text/css"> 
.styled-select select { 
    background: transparent; 
    width: 100%; 
    width: auto; 
    padding: 5px; 
    line-height: 1; 
    border: 0px none transparent; 
    border-radius: 0; 
    outline:0; 
    height: 30px; 
    -webkit-appearance: none; 
    position:absolute; 
    top:-2px; 
    left:-1px; 
    } 
    .styled-select { 
    width: 155px; 
    height: 25px; 
    overflow: hidden; 
    background-image: url("dropdown-arrow.gif"); 
    background-repeat: no-repeat; 
    background-position:top right; 
    background-color:#fff; 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
border-radius: 5px; 
-moz-box-shadow: inset 0px 1px 2px #ccc; 
-webkit-box-shadow: inset 0px 1px 2px #ccc; 
box-shadow: inset 0px 1px 2px #ccc; 
    border: 1px solid #c3c3c3; 
    position:relative; 
    } 

</style> 
<div class="styled-select"> 
    <select> 
     <option value="0">Please Select</option> 
<option value="BILLING" >Default Billing</option> 
<option value="Auburn Office" >Auburn Office</option> 
<option value="Boston Office" >Boston Office</option> 
<option value="Central Ave Office" >Central Ave Office</option> 
<option value="Knoxville Office" >Knoxville Office</option> 
<option value="Seahawks HQ" >Seahawks HQ</option> 
<option value="Test Ship To Address Field Lenght with this line 1" >Test Ship To Address Field Lenght with this line 1</option> 
<option value="Zones" >Zones</option> 
<option value="test address" >test address</option> 
</select> 

</div> 

請參閱： - http://jsfiddle.net/Pq2zH/embedd

Answer 1

最近，我遇到了這個。顯然，在IE 7中有一個錯誤，SELECT列表維護無限的Z索引。要解決這個問題，你可能不得不實現javascript來顯示或隱藏下拉菜單，但這是一個痛苦的解決方案。最好的是貶低對老瀏覽器的支持:)