我有一个可爱的星际迷航红色警报动画使用CSS3。我的一个父元素具有边框半径以及overflow：hidden，以便将任何内容裁剪成边框半径的形状。
这在Firefox中都可以正常工作，但Webkit浏览器会将一些子元素挂在裁剪区域之外。
这是我的代码：
http://jsfiddle.net/doublewombat/EqK6R/embedded/result/
类名为curvedEdges的div具有border-radius和overflow：hidden。但是， “警报”文本的右侧悬挂在此半径之外，即使它们是弯曲的Eges的子元素。或者用简单的英文，动画的左边和右边应该稍微弯曲一点(如在Firefox中)，而不是直线。
如果您没有Webkit浏览器方便，则在YouTube上
解决方法
你可以用边框半径和粗黑色边框放置绝对定位的div，它会阻止你想要隐藏的部分。
我在FF3.6：http://jsfiddle.net/vfp3v/15/中提出了一个有关类似问题的另一个问题的演示
