Css 元素和容器的边界半径相同，但不'；不能很好地对齐

我试图在底部的圆形容器内对齐圆形链接

但是，即使两个元素的边界半径相同，它们之间也会有一点差异，并且在使用高对比度颜色时会很明显

这里有一个问题的中间部分

.container{
边框：2倍纯红；
边界半径：16px；
背景：白色；
溢出：隐藏；
}
.链接{
显示：块；
文本对齐：居中；
边界半径：16px；
背景：红色；
颜色：白色；
填充顶部：8px；
垫底：8px；
}

内容

我可以建议这样的解决方案：

.container{
边框：2倍纯红；
边框底部：无；/*您需要18px的容器。我已经尝试过了，但是仍然可以看到一个小的白色间隙，我想这是因为屏幕像素的渲染。接近但仍然不是我想要的。无论如何，这个固定半径（18px）响应计算？或者只是尝试不同的半径大小？因为我认为如果内部元素改变其半径，这将不起作用。我正在寻找的是半径的动态计算或类似计算。你给我指出了我的问题的正确答案。事实上，我试着为边界大小添加负边距of将容器添加到链接。