在CSS中强迫孩子服从父母的弯曲边界

在CSS中强迫孩子服从父母的弯曲边界

根据规格：

框的背景而不是其边框图像被裁剪为适当的曲线（由“ background-
clip”确定）。修剪到边框或填充边缘的其他效果（例如“可见”以外的“溢出”）也必须修剪到曲线。 替换元素的内容始终会修剪到内容边缘曲线。
同样，边界边缘曲线之外的区域也不接受代表该元素的鼠标事件。

这意味着

overflow: hidden

打开

#outer

应该起作用。但是，这不适用于Firefox 3.6及更低版本。这在Firefox
4中已修复：

圆角现在可以剪辑内容和图像（如果溢出：未设置可见）。

因此，您仍然需要修复程序，只需将其缩短为：

#outer {  overflow: hidden;}#inner {  -moz-border-radius: 10px 10px 0 0;}