相关疑难解决方法(0)

我需要父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;
}

HTML

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

关于JSFiddle的例子

谢谢您的帮助!

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

我刚开始使用Twitter Bootstrap,这是一个问题.

我正在创建自定义<header>块,我希望它的底角是圆形的.

是否有任何"正确"的方法通过使用预定义的类来执行此操作,或者我必须手动指定它:

border-radius: 10px;               // and all that cross-browser trumpery

现在,我正在使用css样式.也许这个问题会更好用less吗？

我正在寻找一种方法来创建一个可以保持居中内容的响应式CSS3圈子.
关于这个圈子,我在这个问题上找到了一些很好的信息.太糟糕了,似乎无法将内容集中在这个内容中.

这个问题与我的问题非常相似,尽管它是一个应该居中的图像.在我的情况下使用背景图像不是一个选项,所以这个选项对我来说也不起作用.

你有什么想法我怎么能接近这个？
当然我可以使用图像,但CSS会更优雅!