Html 使用边界半径和translate3d隐藏溢出

当

溢出的块内容：隐藏和
边界半径
转换后，其角点不会隐藏。有什么解决办法吗？


HTML

由于在translate中未使用z，因此可以将其更改为translate2d，这样做可以：


这在Chtiwi Malek提供的链接中有记录，但在那里它指出这只适用于移动浏览器，我在桌面上有这个问题

编辑

如果在同一元素中设置溢出和转换，它也可以工作（至少在桌面上）

准确地说，你可以把

transform:translate3d（0,0,0）

在您需要
溢出
+
边界半径
组合的元素上…
可能是@EvanMulawski的重复项，它没有帮助，请自己尝试，它隐藏在边界之后。这是webkit中的一个错误：不幸的是，我需要类似translate3d的VAL，只需在容器上设置一个小translate3d，以使溢出：隐藏工作。我使用transform:translate3d（0,0，-1px）；
<div class="scroller">
    <div class="scroller-content"></div>
</div>

.scroller{
    width: 300px;
    height: 500px;
    border: 3px solid red;
    border-radius: 30px;
    overflow: hidden;
}
.scroller-content{
    width: 300px;
    height: 300px;
    background: green;
    -webkit-transform: translate3d(0, -8px, 0);
}

.scroller{
width: 300px;
height: 500px;
border: 3px solid red;
border-radius: 30px;
overflow: hidden;
}
.scroller-content{
width: 300px;
height: 300px;
background: green;
-webkit-transform: translate(0, -8px);
}

.scroller{
    width: 300px;
    height: 500px;
    border: 3px solid red;
    border-radius: 30px;
    overflow: hidden;   
    -webkit-transform: translate3d(0, -8px, 5px);
}
.scroller-content{
    width: 300px;
    height: 300px;
    background: green;
}