IE8의 이미지에서 불투명도가 작동하지 않습니다.

Question

불투명도는 IE8에서 불투명도가있는 DIV의 이미지에 상속되지 않으므로 그 이유가 확실하지 않습니다. 하나는 HTML을 통한 이미지이고, 다른 이미지는 CSS에서 배경으로 설정되어 롤오버 효과를 얻습니다. IE7, IE9, Chrome, Firefox 및 Safari에서 제대로 작동합니다.

내 코드는이 바이올린에 있습니다 http://jsfiddle.net/46AKc/5/

내가

opacity: .75; /* Standards Compliant Browsers */ 
filter: alpha(opacity=75); /* IE 7 and Earlier */ 
    /* Next 2 lines IE8 */ 
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; 
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75); 

에 # 호버 - prod1, 롤오버의 불투명도 변경 사항을 적용하면하지만 완벽하게 .slide 아웃에 혼합하지 않는다 다른 브라우저에서와 같은 방식으로 올바른 해결책이라고 생각하지 않습니다.

나는 운이 다음과 같은 게시물에서 해결책을 시도 :

.hover-products{ 
    position:relative; 
} 

그냥 제거하기 때문에 Opacity CSS not working in IE8
Opacity in IE8 works on <p> but not on <a>
Opacity not working on img in IE8

Answer 1

예,이 두 라인 변경 {색상 : #의 F36F21을}

.hover-제품을 {위치 : 상대 ; 너비 : 338px; 여백 : 20px 0 50px 15px; 높이 : 90 픽셀} 이에

:

.slide 아웃 A : {호버 색상 : #의 F36F21; position : relative;}

.hover-products {width : 338px; 여백 : 20px 0 50px 15px; 높이 : 90 픽셀;}

Answer 2

있다고.

는 여기를 참조하십시오

.slide - 아웃 : 호버 http://jsfiddle.net/46AKc/7/이