CSS alpha opacity IE8 溢出被隐藏

Posted 2023-03-06

【中文标题】CSS alpha opacity IE8 溢出被隐藏

【英文标题】：CSS alpha opacity IE8 overflow is being hidden

【发布时间】：2012-06-07 17:53:31

【问题描述】：

有人可以告诉我我在这里做错了什么吗？内部类 'tab' 应该有一个负的上边距，但是当 -ms-filter:Alpha(opacity=40); 被应用时，容器似乎有一个溢出：强制隐藏。

请记住，这只发生在 IE8 中。这是小提琴：

http://jsfiddle.net/ANh4k/2/

如果我可以提供更多信息，请告诉我，并提前感谢您。

更新这是使用 IE8 开发人员工具的屏幕截图，我已尽可能多地取消选中选项以尝试找出导致不透明问题的原因（请记住，-ms-filter:... 不会显示在 IE8 CSS 开发者列表中；但已应用）。

【参考方案1】：

摆脱了小提琴中的z-index..z-index混淆了IE8，并且它认为您拥有它时不希望溢出..那是IE适合您...

http://jsfiddle.net/ANh4k/40/

  #feed-container-outline.mini.active 
        display:block;
        position:absolute;
        zoom:1;
        right:5px;
        top:45px;
        width:370px;
        height:53%;
        min-height:320px;
        background:#ED9A27;
        opacity:.4;
        border:2px solid #F16719;
        -moz-box-shadow:1px 1px 3px #aaa;
        -webkit-box-shadow:1px 1px 3px #aaa;
        -o-box-shadow:1px 1px 3px #aaa;
        box-shadow:1px 1px 3px #aaa;
        overflow:visible;
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; 



 #feed-container-outline.mini.active .tab 
        display:block;
        overflow:auto;
        position:absolute;
        float:right;
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
        width:70px;
        right:-1px;
        top:-45px;
        height:45px;
        background:#ED9A27;
        border:2px solid #F16719;
        border-bottom: 0px;
​

【讨论】：

我遇到的问题是，由于某种原因，当我使用 -ms-filter:"progid......" 语法时，不透明度不起作用（它甚至不是一点点不透明。现在当我使用filter:Alpha(opacity=40); 时，应用了不透明度并渲染得很好，但是现在溢出隐藏问题仍然发生......我该怎么办？

是的，我明白了，但它在 IE8 中使用我制作的小提琴对我来说很好......在我发布的同一个小提琴中尝试使用 Opacity 中的小写 o。并且看到没有z-index。对我来说，这对整个事情进行了排序，所以也试试你的第一个没有 z-index 的小提琴。我现在不在电脑前，所以我无法检查。但我当时就搞定了。

不透明度中的小写“o”并没有为我解决这个问题。有趣的是，你的小提琴在 IE8 中对我来说确实很好用，只是我的网站没有正确显示它，这很奇怪，因为我用你的确切语法替换了我以前的元素样式。任何其他想法，也许我的 CSS 中的其他人与之冲突？但是什么？

确实很有趣...我不明白为什么它不应该工作！现在没有 z-index，您是否尝试过 filter:opacity 而不是 progid....one？此外，在您的网站上，是否有一个父 div 有一个 z-index，您可能会尝试摆脱它？另外，您是从这里复制了我的代码还是从我的小提琴中复制了我的代码？拿一个你知道有效的小提琴。

我从小提琴中复制了一个；）。另外，我正在使用-ms-filter:"Alpha(opacity=40)"; 的不透明度实现语法。这个设计中唯一涉及的两个 div 是您已经处理过的两个....我在我的 OP 中添加了一个屏幕截图，请查看。