Html 引导中的隐藏行具有高度

当然，这有一个简单的答案，但我无法理解它

我有一个引导表，它有隐藏的行，在单击隐藏在后面的行时显示。但是，隐藏的行会显示出来，我无法让它们在未选中时消失

正在尝试按照此图片清除行之间突出显示的空格：

地位
名称
导丝
好
福巴
别的
基础知识
DEF
S1
废话
S1
废话
好的2
FooBar 2
还有别的吗
基础知识
DEF
S1
废话
S1
废话

---

如果您知道如何将.table条带化以忽略隐藏行，那就太好了。

重置css属性

.table.table-hover {
    line-height: 0;
    height: 0px;
    padding: 0;
}

---

这是顶部和底部的填充物。你可以用..重置它

.table>tbody .hidden-row {
   padding: 0 8px;
}

---

这样，它只调整

隐藏行

，而不覆盖引导表默认值。此外，您可能希望保留左/右填充，以便隐藏行中的列正确对齐。

正是填充为其提供了空间。 这应该行得通

.table>tbody>tr>td.hidden-row, .table>tbody>tr>th.hidden-row, 
.table>tfoot>tr>td.hidden-row, 
.table>tfoot>tr>th.hidden-row, .table>thead>tr>td.hidden-row, 
.table>thead>tr>th.hidden-row {
   padding: 0;
}

试试下面的代码，让我知道它是否适合您
**CSS**
.内部表格数据
{
页边距底部：0；
}
**HTML**
地位
名称
导丝
好
福巴
别的
基础知识
DEF
S1
废话
S1
废话
好的2
FooBar 2
还有别的吗
基础知识
DEF
S1
废话
S1
废话

链接到JSFIDLE，因为编辑器在主要问题上不允许这样做：您是否阅读了它不允许您将链接添加到FIDLE的原因。不要忽视这个问题rules@gnuchu--请将代码添加到question@Pete：是的。尝试添加代码，但直到我删除它和链接，错误才会消失。

.table>tbody>tr>td.hidden-row, .table>tbody>tr>th.hidden-row, 
.table>tfoot>tr>td.hidden-row, 
.table>tfoot>tr>th.hidden-row, .table>thead>tr>td.hidden-row, 
.table>thead>tr>th.hidden-row {
   padding: 0;
}

Try the below code and let me know if it works for you

**CSS**

.inner-table-data
 {
   margin-bottom: 0;
 }

**HTML**



<table class='table table-hover table-bordered table-striped'>
        <thead>
            <tr>
                <th>Status</th>
                <th>Name</th>
                <th>GuideWire</th>
            </tr>
        </thead>
        <tbody>
            <tr data-toggle='collapse' data-target='#info_1'>
                <td class="col-sm-4">Good</td>
                <td class="col-sm-4">FooBar</td>
                <td class="col-sm-4">Something else</td>
            </tr>
            <tr>
                <td colspan='1' class='collapse' id='info_1'>
                    <div>
                        <table class="table table-striped inner-table-data">
                            <thead>
                            <th>ABC</th>
                            <th>DEF</th>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>S1</td>
                                    <td>Blah</td>
                                </tr>
                                <tr>
                                    <td>S1</td>
                                    <td>Blah</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </td>
            </tr>
            <tr data-toggle='collapse' data-target='#info_2'>
                <td class="col-sm-4">Good 2</td>
                <td class="col-sm-4">FooBar 2</td>
                <td class="col-sm-4">Something else 2</td>
            </tr>
            <tr>
                <td colspan='1' class='collapse' id='info_2'>
                    <div>
                        <table class="table table-striped inner-table-data">
                            <thead>
                            <th>ABC</th>
                            <th>DEF</th>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>S1</td>
                                    <td>Blah</td>
                                </tr>
                                <tr>
                                    <td>S1</td>
                                    <td>Blah</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>