我已将border-radius（以及-moz-border-radius对于旧版浏览器）设置为 20px，并且它在 Safari 和 Firefox 中运行良好。然后，我打开 Chrome，它拒绝接受定义的border-radius. 有什么建议可以在 Chrome 中解决这个问题吗？
在此处查看实际的 CSS 编码：http: //jsfiddle.net/MAYea/
Safari 中的屏幕截图：
Chrome 中的屏幕截图：
问问题
13157 次
6 回答
6
不是那border-radius不起作用，而是overflow未能隐藏溢出。
这实际上是 Chrome 中的一个新错误。我的世界末日时钟也有类似的问题，尽管它在早期版本的 Chrome 中运行良好。
作为一种解决方法，您可以border-radius在包含的元素以及容器上指定 。
于 2012-12-15T06:18:29.953 回答
2
我有一个类似的问题，它有助于添加
z-index: 0; /* or some other value */
但是也
transform: translateY(0);
似乎这正在启用某种不同的渲染（猜测没有像我们有时对强制 GPU 渲染所做的那样的 3d 上下文......）
这行得通的原因我无法解释，也许其他人可以？
我现在有这个特殊的问题，在 OS X 10.10.5 上使用最新的 Chrome v44 ......是的，我知道这是“固定的”，这是一个老问题 =）......
编辑：在另一个 SO-Question 中找到相同的修复程序，请在此处查看：链接
于 2015-08-21T15:35:46.340 回答
1
-webkit-border-radius:我想你在找什么？
于 2012-12-15T06:17:26.130 回答
1
将border-radius: 20px;CSS 规则添加到两者:before和:after
于 2012-12-15T06:21:02.653 回答
0
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
-webkit-border-radius: for the Chrome
如果您需要它，请从这里尝试这个 javascript 库
于 2012-12-15T06:18:58.433 回答
0
您可以使用，
border-radius: 100
代替，
border-radius: 100px
它会在 IE 中完成这项工作，但在 Chrome 中却不行。
于 2020-01-08T14:12:38.780 回答