IE8/IE9 Bug - 使用 IE 筛选器时出现意外行为

IE8/IE9 Bug - Unexpected behavior when using IE filters

提问人:Nick 提问时间:9/29/2012 最后编辑:PavloNick 更新时间:9/30/2012 访问量:169

问:

我使用以下代码创建了一个 html 块:

<div class="container">
    <div class="float">info<br/>info<br/>info</div>
    <div class="fluid">
        <div class ="fluidinner">
            <div class="text">one two</div>
            <div class="cleardiv"></div>
        </div>
    </div>
</div>

...第二个块的代码完全相同,只是这次 class=“fluid” 改为 class=“fluid2”。

CSS 是:

.float {
    background-color:pink;
    width:100px;
    float:left;
}
.fluid {
    background-color:#d3dadb;
    padding:5px;
}
.fluid2 {
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3dadb', endColorstr='#ffffff',GradientType=0 );
    padding:5px;
}
.fluidinner {
    background-color: gray;
}
.cleardiv {
    clear:both;
}

因此,“fluid”具有纯色背景,而“fluid2”具有使用 IE 过滤器属性“filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3dadb', endColorstr='#ffffff',GradientType=0 )” 的背景渐变

结果(屏幕截图):http://s14.postimage.org/v8qn1wvin/iebug.jpg

“fluid2”虽然清晰,但不会延伸到其容器的高度。

Jsfiffle:http://jsfiddle.net/waGEk/1/

html css 互联网浏览器-9

评论


答:

0赞 Niet the Dark Absol 9/29/2012 #1

您需要将渐变应用于容器:更新的小提琴