父DIV中的圆角不影响儿童DIV

Question

所以,我正在尝试在CSS3中使用圆角(不是在IE中,不关心它是否在那里工作),而且我有DIV,我的所有内容看起来都很漂亮.我遇到的问题是,有些孩子的DIV没有被父母的圆角"遮盖".我不是在寻找孩子继承圆角.我只想让父母内部的任何内容在圆角处不可见,就像它被掩盖了一样.我尝试使用"overflow:hidden;",但这似乎没有办法.

有没有人有任何想法如何圆形角容器DIV的孩子可以被父DIV掩盖？如果它有用,我正在使用"position:absolute;" 在父DIV上.不确定这是否会有所不同.

谢谢!

Answer 1

尝试添加overflow: hidden;到父元素.这解决了我的问题.

Answer 2

在 div 上使用内边距。如果使填充等于半径，则不必担心任何重叠或圆形区域中出现的内容。

<style>
.round{
border-radius:10px;
padding:10px;
background-color:red;
}
</style>

<div class="round">Rounded Corners</div>

这是一个有用的网站，其中讨论了有关 CSS3 边框半径的所有内容：http://www.css3.info/preview/rounded-border/。