父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 Border Radius： http ： //www.css3.info/preview/rounded-border/ 。