单选按钮不适合 table？

Question

我正在研究这个计算器，当用户 select 其中一种 table 应该出现在 select 来自 table 的一种类型但是应单击的单选按钮不适合 table

这是在 table 的 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.

单选按钮不适合 table？

radio button doesn't fit inside a table?

html

javascript

css

jquery

radio-button