在表格单元格中对齐按钮标签

Question

我有一个带有可见标签的隐藏按钮，我试图在表格单元格中居中对齐。

table {width: 150px}
table, td {
  border: 1px solid purple;
  text-align: center
}
label {
  background-color: red;
  height: 32px;
  width: 32px;
  border-radius: 50%;
  position: fixed
}
button {
  visibility: hidden
}

<table>
  <tr><td>
    Some title
  </td></tr>
  <tr><td>
    <label><button></button></label>
  </td></tr>
</table>

标签没有居中，溢出 td。如果我删除

位置：固定

稍微好一点，但圆圈越来越小了。我怎样才能改进这一点以获得预期的结果？谢谢:)

另外，这里发生了什么？非常感谢参考学习材料，以便我能够以结构化的方式理解这些 CSS 奥秘。

Answer 1

将position:fixed; 替换为display:inline-block;