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를 구현해야 할 수도 있지만 고통스러운 해결책입니다. 가장 좋은 방법은 이전 브라우저에 대한 지원을 중단하는 것입니다.