在IE8中的不透明度取決於位置：相對

我注意到在某些情況下，表單元素不能在IE8中變得透明。原來取決於位置：相對CSS標籤。下面的HTML演示問題：在IE8中的不透明度取決於位置：相對

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>title</title> 

<style type="text/css"> 

.ie-opaque { 
    zoom : 1; 
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 
    filter: alpha(opacity=50); 
} 

.relative { 
    position: relative; 
} 

</style> 


</head> 
<body> 

    <div class="ie-opaque"> 
     <form> 
     <fieldset> 
     <ol> 
      <li class="relative"> 
       <label for="test">label</label> 
       <input id="test"/> 
      </li> 
      <li class="relative"> 
       <button>push</button> 
      </li> 
      <li> 
       <label for="test">label</label> 
       <input id="test"/> 
      </li> 
      <li> 
       <button>push</button> 
      </li> 
     </ol> 
     </fieldset> 
     </form> 
    </div> 

</body> 
</html>

在IE8項目3和4是透明的，1和2是不透明的。任何想法爲什麼？

來源

2011-03-25 Peter Szanto

這是不是一個真正的答案（對不起），但它在某些如果不是所有的瀏覽器是常見的（雖然我更MSIE看到它在多宗）除非「位置：相對」，否則某些造型屬性不適用。明確定義在一個元素上。我一直認爲它主要是出於向後兼容的原因（當不是扁平化錯誤時）。 – 2011-03-25 14:29:10