引导表内的空按钮。如何设置为 100% 高度？ [复制]答案

【问题标题】：Bootstrap empty button inside table. How to set on 100% height? [duplicate]引导表内的空按钮。如何设置为 100% 高度？ [复制]
【发布时间】：2020-07-15 02:42:58
【问题描述】：

您好，我无法将引导表中的空按钮设置为 100% 高度。这是我的情况：jsfidle

我使用了这个，但空按钮没有设置为 100%

td{
  padding:0;
}

td button, td div{
  width:100%;
  height:100%;
}

table th, table td {
  padding: 0!important;
}

【问题讨论】：

将height:0 添加到td 就可以了

标签： html css twitter-bootstrap sass bootstrap-4

【解决方案1】：

要解决空按钮上的问题，您应该使用 CSS，而不是将高度设置为 100%，您可以简单地放置一个以像素为单位的值，例如 25px 似乎可以工作。

td{
  padding:0;
}

td button, td div{
  width:100%;
  height:25px;
}

table th, table td {
  padding: 0!important;
}

这是您的问题的结果： https://jsfiddle.net/79jzkwup/

【讨论】：

不是很好的答案，因为我不知道一列中有多少个按钮。（至少两个）。但我认为没有更好的选择，所以谢谢你
您可以添加任意数量的按钮，只要您保持设置符合您的设计，如果需要，您还可以在按钮中添加功能。很高兴我能帮助你。祝你的项目好运。

【解决方案2】：

另一种选择是在空的<Button> 元素中放置一个&nbsp;（不间断空格）：

<Button class="btn btn-success">&nbsp;</Button>

Fiddle for the nbsp method

或者您可以使用这个 css 方法，它使用 ::before 选择器和带有转义 unicode 字符的 content 属性。在这种情况下，\00a0 相当于 &nbsp;

td button.btn.btn-success::before {
  content: '\00a0';
}

Fiddle for the css method

【讨论】：