Android浏览器不支持具有百分比值的边界半径

Tit*_*hos 7 html css android css3 browser-support

在Android浏览器上使用边界半径中的%值是否存在已知问题?

我注意到我使用时:

.element {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
Run Code Online (Sandbox Code Playgroud)

边框半径似乎适用于所有移动浏览器,但是当我使用时:

.element {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}
Run Code Online (Sandbox Code Playgroud)

边框半径不适用于Android浏览器.

Luc*_*emy 11

是的有:点击此处,然后点击已知问题.

这就是它所说的:

1. Android Browser 2.3 does not support % value for border-radius.

2. Border-radius does not work on fieldset elements in IE9.

3. The stock browser on the Samsung Galaxy S4 with Android 4.2 does not support the "border-radius" shorthand property but does support the long-hand properties for each corner like "border-top-left-radius".
Run Code Online (Sandbox Code Playgroud)

你用什么百分比值?请告诉我们,我们可以为您提供进一步的帮助.

现在,既然你用它来制作圈子,那么你可以使用一个肮脏的黑客:

#circle {
  border-radius: 9999px; /* makes it a circle */
}
Run Code Online (Sandbox Code Playgroud)

这应该工作正常.