首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何让CSS3圆角在Chrome/Opera中隐藏溢出

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

Stack Overflow用户
提问于 2011-04-21 04:53:19
回答 11查看 115.6K关注 0票数 156

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

这在火狐和IE9中是有效的:

CSS

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

#box {
  width: 300px;
  height: 300px;
  background-color: #cde;
}

HTML

<div id="wrapper">
  <div id="box"></div>
</div>

Example on JSFiddle

谢谢你的帮助!

更新:导致这个问题的bug 已经在Chrome中修复了。然而,我没有重新测试Opera或Safari。

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/5736503

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档