不需要的边界半径伪影，带有框阴影扩散

Question

目标是一个边缘柔和的无边界圆圈，包含文本或其他元素。 如何摆脱以下示例中的细黑色边框线？ 我尝试添加具有相同或透明颜色的边框。 它可以用 1px x 1px 和大的传播来完成，但我想把东西放进去。

 body { background: black; } div { width: 50px; height: 50px; margin: 50px; padding: 50px; border-radius: 50%; background: white; box-shadow: 0 0 10px 10px white; }

 <div>some text</div>

Answer 1

使用radial-gradient()

 body { background: black; } div { width: 50px; height: 50px; margin: 50px; padding: 70px; border-radius: 50%; background: radial-gradient(farthest-side,white calc(100% - 15px),transparent ); }

 <div>some text</div>