如果你看不到这个问题，那么请尝试看看这个codepen，在这里你应该明白我的意思。
我尝试了几种方法来修复它。在下面的评论中，您可以看到其中之一。仍然它似乎在适当的边框和阴影之间呈现 1px 崎岖的边框。
如果它取决于浏览器渲染器，那么它是一个错误吗？如何为所有现代浏览器正确修复它。
html{
background-color: #554343;
}
div{
display: block;
width: 300px;
height: 300px;
margin: 0 auto;
border-radius: 50%;
border-width: 0; /* no result
border-width: 2px; // uncommented no result
border-style: solid;// uncommented no result even with inset*/
background-color: white;
box-shadow: inset 1px 1px 150px, inset -1px -1px 150px;
}<div>
</div>编辑：也试过这种方式，但没有积极的结果：
html{
background-color: #554343;
}
.container{
display: block;
width: 300px;
height: 300px;
margin: 0 auto;
border-radius: 50%; /* tried 49.5% but it's not acceptable */
box-shadow: inset 1px 1px 150px #000, inset -1px -1px 150px #000;
}
.content{
position: relative;
width: 100%;
height: 100%;
border-radius: 50%;
background-color: white;
z-index: -1;
}<div class="container">
<div class="content">
</div>
</div>