相关疑难解决方法(0)

如何使CSS3圆角隐藏在Chrome/Opera中溢出

我需要父div上的圆角来掩盖其孩子的内容.overflow: hidden在简单的情况下工作,但在父级相对或绝对定位时,基于webkit的浏览器和Opera会中断.

这适用于Firefox和IE9:

CSS

#wrapper {
  width: 300px;
  height: 300px;
  border-radius: 100px;
  overflow: hidden;
  position: absolute;
}

#box {
  width: 300px;
  height: 300px;
  background-color: #cde;
}
Run Code Online (Sandbox Code Playgroud)

HTML

<div id="wrapper">
  <div id="box"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

关于JSFiddle的例子

谢谢您的帮助!

更新:导致此问题的错误已在Chrome中修复.我没有重新测试Opera或Safari.

html css rounded-corners css3

147
推荐指数
7
解决办法
10万
查看次数

标签 统计

css ×1

css3 ×1

html ×1

rounded-corners ×1