javascript - 单选按钮不适合放在表格内？

Question

我正在开发这个计算器，当用户选择其中一种类型时，应该会出现一个小表格，以从该表格中选择一种类型，但应单击的单选按钮不适合表格

这是在表的 ccs 代码中查找，完整代码在 jsfiddle link

    table {
border: 1px solid #ccc;
border-collapse: collapse;
margin: 0;
padding: 0;
width: 100%;
table-layout: fixed;
}
.rad
{width:1em;
height:1em;}
table thead,
table tbody {
  display: block;
}
table thead th ,table tbody td
{
  font-size : 12px;
}
table tbody {
  max-height: 100px;
  overflow-y: overlay;
  overflow-x: hidden;
}
tr:hover{
background-color:gray;
cursor:pointer;
}
table tbody td, table thead th {
  text-align: center;

}

table tbody td:last-child, table thead th:last-child {
  border-right: none;
}

table tbody td:first-child, table thead th:first-child {
  width: 10px;
}
table tbody td:nth-child(2), table thead th:nth-child(2) {
  width: 100px;
}
table tbody td:nth-child(3), table thead th:nth-child(3) {
  width: 100px;
}
table tbody td:nth-child(4), table thead th:nth-child(4) {
  width: 100px;
}
table tbody td:nth-child(5), table thead th:nth-child(5) {
  width: 100px;
}

Answer 1

只需从 input[type="radio"] 的 css 中删除 position:absolute 即可。工作Fiddle .