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

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;