子元素不继承父级的曲线边缘？

Question

我在my page有一个旋转木马。我有父元素和子元素的边缘都弯曲但当你按下“下一步”或“上一步”并滑动旋转木马时，孩子在移动时不会保持弯曲状态。我该如何防止这种情况？

.holder {
width:650px;
margin:200px auto;
overflow:hidden;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}

#s7 #posts {
width: 620px; 
padding: 15px; 
color: #333; 
font-size: 14px; 
text-align:left; 
background:#EEE;
line-height:16px;
min-height:500px;
overflow:visible;
z-index:-1;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}

Answer 1

实际上，我愿意打赌它确实保持弯曲状态，只是快速看到它。它不会看弯曲，因为你看到它的中间部分，当它是动画时，当然，它不是弯曲的（例如，你看到的是盒子的顶部，而不是左上角角）。

将半径添加到父div#s7，您应该设置。

Answer 2

确保将border-radius CSS传递给JavaScript，或者确保JS / JQuery没有删除它。

使用Firebug，我可以看到没有为生成的所有<div>分配border-radius属性。在JS中添加该属性可以解决问题。