непрозрачность, т. Е. Использование абсолютно позиционированных divs не работает

Я несколько секунд стучал головой о стену, пытаясь разобраться в этом. Я пытаюсь поместить один div поверх другого, чтобы угасать один поверх другого. У divs будет изображение и некоторый другой html в них. Я не могу получить непрозрачность для работы в ie8. Я максимально упростил свой html:непрозрачность, т. Е. Использование абсолютно позиционированных divs не работает

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 

<style> 

    * { margin: 0; padding: 0; } 

    .carousel-container { 
    position: relative; 
    } 

    .carousel-overlay { 
    position: absolute; 
    } 

    #carousel-container-a { 
    opacity: 1; 
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); 
    } 

    #carousel-container-b { 
    opacity: 0; 
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; 
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);  
    } 

    h1 { font-size: 100px; } 


</style> 

</head> 
<body> 


<div id="carousel-container-a" class="carousel-container"> 
    <div class="carousel-overlay" style="left: 10px; top: 10px;"> 
    <h1 style="color: black;">Showcase</h1> 
    </div> 
    <!-- other elements removed for simplicity --> 
</div> 
<div id="carousel-container-b" class="carousel-container"> 
    <div class="carousel-overlay" style="left: 20px; top: 20px;"> 
    <h1 style="color: red;">Welcome</h1> 
    </div> 
    <!-- other elements removed for simplicity --> 
</div> 


</body> 
</html>

Почему непрозрачность не работает? Как я могу заставить его работать?

источник

2009-10-14 camomileCase

Попробуйте применить haslayout к элементам.

#carousel-container a { zoom:1; }

Ширина/высота/встроенный блок и множество других будут работать.

источник

2009-10-14 23:34:00

Дайте этот выстрел:

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;

Это включает в себя оба утверждения для IE7 и IE8. Это должно правильно обработать непрозрачность. Хотя это похоже на то, что вы уже используете, я изменил инструкции. Согласно Microsoft, вы должны сначала указать новый формат расширения, а затем более старые настройки. Это в дополнение к настройке непрозрачности CSS.

источник

2009-10-15 13:27:41 Slevin

непрозрачность, т. Е. Использование абсолютно позиционированных divs не работает

ответ

Смежные вопросы