使用transform：scale时保留border-radius

Question

我想知道在使用transform: scale时如何保留border-radius属性。

我在伪元素-webkit-transform: scale(1);上使用.my-div::after。 .my-div::after也有一个css规则border-radius: 50%。这个想法是当我点击它时，它的幅度从0到1。

桌面Chrome浏览器中的所有内容都运行良好，但是当我在Android webview上运行它（这是一个Cordova项目。我在Android 4.4上运行它）时，会发生以下情况：

1. 删除边框半径
2. .my-div从0到1缩放为矩形
3. 边框半径恢复为正确的值50%。

有人建议将border-radius应用于父元素，但是我不能将边界半径应用于父元素，因为我正在处理一个伪元素，并且将它应用于父元素将不会产生预期的结果。

有什么建议吗？

修改

以下是我的代码简介：

.btn:after {
  width: 16px;
  height: 16px;
  -webkit-transform: translate3d(0, 0, 0) scale(0);
  border-radius: 50%;
  -webkit-transition: all 450ms cubic-bezier(0.8, 0.5, 0, 1.8);
  transition: all 450ms cubic-bezier(0.8, 0.5, 0, 1.8);
}

.selected .btn:after {
  background-color: #fff;
  -webkit-transform: translate3d(0, 0, 0) scale(1);
  ...
}