我正在尝试开发在父 div 中具有边框半径的幻灯片框。它适用于 Firefox，但在 safari 和 chrome 中出现问题。
问题是子元素与父 div 的圆角边框重叠。
你可以在http://jsfiddle.net/7KgEh/6/看到这个例子。看看 safari、chrome 和 firefox；您会在右侧看到差异，子 div 与父 div 的圆形边框重叠。
我搜索了互联网，但大多数帖子都指出它是 webkit 错误。有人知道解决方案吗？
问问题
2803 次
3 回答
15
只需添加overflow: hidden;到带有圆形边框的容器元素中。
于 2012-11-24T16:44:53.763 回答
0
圆角工作正常，它只是占用width:100%（页面） for <div class='box'>，因此您看不到它。试试看width:50%，你会明白我在说什么。在这里试试这个jsfiddle
于 2012-09-19T18:44:36.663 回答
0
如果您不需要与该背景进行交互，您可以用 z-index 将其掩埋：
掩埋背景并将按钮向上移动以成为它的兄弟，并写下额外的行以保持它们对齐。如果这是出于显示目的，这将总体上更加灵活（还允许按钮与插槽重叠）。如果有结构性原因，那么另一种选择可能会更好。
于 2012-09-19T19:30:34.490 回答