圆圈化身的CSS不适用于Safari浏览器

Question

我正在为我的博客使用gatsby反应模板，但是当我在Safari (iPhone或Mac)上打开它时，化身图像不是圆形的。easy-code.blog

这就是我用来制作神通的风格。

.bio-avatar {
  margin-right: var(--spacing-4);
  margin-bottom: var(--spacing-0);
  min-width: 50px;
  border-radius: 100%;
 }

Answer 1

您应该用此代码来更改CSS代码。问题是border-radius值。

.bio-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  overflow: hidden;
}