溢出& border-radius:PIE不工作

时间:2014-06-27 14:39:08

标签: html css internet-explorer-8 css3pie

即使使用PIE,我也无法在IE8上获得border-radius属性。

我想做什么?

进度条

如何?

带有圆形边框(border-radius: 15px)和灰色背景的父div。儿童div(长方形)有绿色背景。子角应隐藏在父形状之外(overflow:hidden)。

问题:

在IE8上,父形状有圆角但子div没有(通过删除overflow: hidden可以在其他浏览器上获得相同的结果)

为什么这个解决方案“Overflow:hidden for rounded borders using css3pie in IE8?”无法回答我的问题?

我不希望我的孩子div有圆角,例如61%(see my JSFiddle),绿色形状的右侧是矩形。 (我不想在其上添加border-radius属性)

代码&演示?

JSFiddle:link

HTML

<div class="container">
    <div class="progress" style="width:61%"></div>
</div>

CSS

.container {
    width: 200px;
    height: 30px;
    border: solid 1px black;
    position: relative;
    background: #AAA;
    border-radius: 15px;
    behavior: url(/Content/PIE.htc);
    /* REMOVE TO SEE THE RESULT ON IE8 : */
    overflow:hidden;
}

.progress {
    height: 100%;
    background: #5F5;
}

有没有人有想法处理它?<​​/ p>

0 个答案:

没有答案