无法在表格中的列高度为 100% 时制作按钮

Question

你好，我的桌子有问题。我正在使用引导程序。表中有一些列（其中一些填充了数据，有些则没有）。每列都必须是一个按钮（空列也是如此）。我在 td 的 100% 高度上制作列中的按钮时遇到问题。一个条件是 td 中是 div 并且该 div 中有按钮。所以结构看起来像这样：

<tr>

 <td>

   <div> //THIS DIV IS IMPORTANT i am using react-bootstrap framework and component Button is including that div inside 

     My text data empty or not

   </div>

 </td>

</tr>

我删除了填充，我将 div 和按钮设置为 100% 高度和宽度，但按钮高度仍然不是 100%。请问问题出在哪里？

这是jsfiddle

我之前在这里放了坏链接现在应该没问题了

Answer 1

我检查了你的小提琴和情侣笔记：Bottom将元素更改为button.由于您使用的是 bootstrap，因此您继承了它们的样式。覆盖它的最快方法是使用!important.您可以添加：table th, table td {padding: 0!important;}然后button {height: 100%}将按预期工作。

Answer 2

阻止按钮具有 100% 高度的是表格 th 和 td 中的填充。.table&nbsp;td,&nbsp;.table&nbsp;th&nbsp;{ &nbsp;&nbsp;padding:&nbsp;0; }