Html CSS firefox td单元按钮高度

我对Firefox中的CSS有一个问题。我需要一个按钮来填满表格单元格的高度。它在Chrome中运行良好，但在Firefox中不起作用

Firefox（不正确）：

铬（正确）：

HTML:

请就此提供任何建议。 谢谢。你可以试试这个

td-风格

table.custom-table-1 > tbody > tr > td.action {
    padding: 0px;
}
table.custom-table-1 > tbody > tr > td {
    font-size: 17px;
    padding: 5px 15px 2px;
    position: relative; /* MAKE TD'S RELATIVE */
}
.table-bordered > tbody > tr > td,{
    border: 1px solid #DDD;
}

button styles
table.custom-table-1 > tbody > tr > td.action > .btn {
    height: 100%;
    box-sizing: content-box;
    padding: 0px;
    border: medium none;
    position: absolute; /* MAKE POSITION ABSOLUTE */
    width: 100%; /* WITH 100% WIDTH */
}
table.custom-table-1 > tbody > tr > td.action > .btn, .btn.delete {
    border-radius: 0px;
    margin-right: 0px;
    padding: 5px 10px;
    width: 33px;
    min-height: 33px;
}

---

为了在Firefox中控制单元格高度，需要两件事：

表{表布局：固定；}

单元内的块（如div）元素

只需增加块元素的高度，当它超过表格单元格的高度时，它不仅会拉伸单元格，还会拉伸tr、tbody和表格。也没有溢出

查看Firefox和Chrome中的代码片段

功能调整高度（H）{
var tgt=document.querySelector（“div”）；
tgt.style.height=H+'px'；
}
var ha=document.getElementById（'htAdj'）；
ha.addEventListener（'input'，函数（事件）{
var H=ha值；
返回高度（H）；
}，假）
表格{
表布局：固定；
边框：1px纯蓝色；
宽度：200px；
高度：40px；
}
运输署{
边框：1px纯绿色；
}
div{
边框：2个红色虚线；
身高：0；
}
输入{
显示：内联块；
宽度：130px；
}
高度：+
您必须使按钮父级的高度达到100%，在您的情况下，
元素也达到100%。请参见
您提供了CSS来设置
的样式，并在您的问题中提供了一个
。如果您向我们展示的
呈现正确/不正确，请提供足够的HTML和CSS，我们可以重现您展示的视觉结构。@AndreyP请查看我的答案，并让我知道它是否解决了您的问题。@AndreyP很好，如果您可以将我的答案标记为“正确”单击我的答案旁边的复选标记。Unfotunaly now（立即取消）按钮显示所需的1倍以下：（将
.btn
上的
框大小更改为
框大小：边框框；
<td style="width: 30px;" class="action" > 
<button class="btn grey-silver"> 
  <span class="action"></span>
</button>   
</td>

table.custom-table-1 > tbody > tr > td.action {
    padding: 0px;
}
table.custom-table-1 > tbody > tr > td {
    font-size: 17px;
    padding: 5px 15px 2px;
    position: relative; /* MAKE TD'S RELATIVE */
}
.table-bordered > tbody > tr > td,{
    border: 1px solid #DDD;
}

button styles
table.custom-table-1 > tbody > tr > td.action > .btn {
    height: 100%;
    box-sizing: content-box;
    padding: 0px;
    border: medium none;
    position: absolute; /* MAKE POSITION ABSOLUTE */
    width: 100%; /* WITH 100% WIDTH */
}
table.custom-table-1 > tbody > tr > td.action > .btn, .btn.delete {
    border-radius: 0px;
    margin-right: 0px;
    padding: 5px 10px;
    width: 33px;
    min-height: 33px;
}