Закругленные углы в родительском 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/.