Html tr/td高度拒绝为0

我正在尝试做一件非常简单的事情：将

tr

的高度设置为

0px

，但它不起作用

请参阅代码或了解我尝试过的内容

HTML:

结果:

结果中有红色，因此

tr

高度仍然不是0

如何在保持宽度的同时使其为0

---

编辑：问题似乎是嵌套在

td

中的

复选框

。如何将其高度降至0？

添加

字体大小：0；保证金：0

到类

通过使用不透明性，我们可以隐藏

tr td

的内容。一旦选中将其包装在

DIV

中，将其设置为不够高，隐藏

溢出

：

div {
 height: 1.2em;
 overflow: hidden;
}

---

如果你想保持宽度，你也需要设置这些

line-height: 0 !important;
visibility: hidden;

---

我只是遇到了一个非常类似的问题——我的解决方案是将height和max height都设置为s.th。略高于0，就像这样

height:0.01px; max-height:0.01px;

也许结合

visibility:hidden;

---

不知道，为什么将其设置为0不起作用。但是，也许使用0.01px而不是0px对您来说仍然足够了

结合其他几种解决方案：

td {
  overflow: hidden;
  line-height: 0;
}

如果没有完整的文本，而显示的是部分文本，则可以使用：

<td><div>text</div></td>

---

我知道我参加聚会迟到了，但我在Bootstrap 3桌上也遇到了同样的问题。在Chrome inspector中，看起来引导css选择器非常具体，因此它们似乎优先于我的css，除非我更加具体。因此，尽管以下措施不起作用：

tr.my-class td {
    height: 0;
    padding: 0;
    border-top: 0;
    overflow: hidden;
    line-height: 0;
    transition: all ease 0.5s;
}

tr.my-class.expanded td  {
    height: 20px;
    padding: 5px;
    border-top: 1px solid #ddd;
    line-height: 20px;
}

将其更改为此以镜像引导选择器工作：

table>tbody>tr.my-class>td {
    height: 0;
    padding: 0;
    border-top: 0;
    overflow: hidden;
    line-height: 0;
    transition: all ease 0.5s;
}

table>tbody>tr.my-class.expanded>td  {
    height: 20px;
    padding: 5px;
    border-top: 1px solid #ddd;
    line-height: 20px;
}

---

我会添加

可见性：collapse

to

tr

修复该问题

为什么要将tr设置为0高度？或者只是想对用户隐藏这些输入字段？@FrozenFire为什么用600个字符解释有点困难，但我可以说我需要

tr

高度为0，而不仅仅是输入。你可以将这些输入放在标题1或标题2下，然后隐藏它。@FrozenFire通过以下方式隐藏它。。。将高度设为0？此外，他们应该保持自己的

tr

。隐藏整行怎么样？使用

style=“display:none；”“

。回答得好，但我需要保持宽度。请参阅我的编辑，抱歉。@Quelklef解决方案能否明确指定任何宽度？如果是这样，请使用字体大小：0并手动声明宽度。虽然我可以这样做，但我不希望这样做。这样，我可以更改孩子的宽度，而不必更改

tr

的属性。哦，我误解了你的建议。虽然它可以做一些工作，但它并没有将

tr

高度设置为0，这正是我所要求的。避免给出一个线性答案。试着解释你的答案，或者当你有足够的声誉发表评论时，把它作为一个评论。

td div {
    overflow: hidden;
}

tr.my-class td {
    height: 0;
    padding: 0;
    border-top: 0;
    overflow: hidden;
    line-height: 0;
    transition: all ease 0.5s;
}

tr.my-class.expanded td  {
    height: 20px;
    padding: 5px;
    border-top: 1px solid #ddd;
    line-height: 20px;
}

table>tbody>tr.my-class>td {
    height: 0;
    padding: 0;
    border-top: 0;
    overflow: hidden;
    line-height: 0;
    transition: all ease 0.5s;
}

table>tbody>tr.my-class.expanded>td  {
    height: 20px;
    padding: 5px;
    border-top: 1px solid #ddd;
    line-height: 20px;
}