css - 具有最小高度的表格自动滚动

Question

我在使用 Twitter Bootstrap 时遇到了一个非常烦人的问题。我有一个包含一行和两个单元格的表格(调用 F)，在第一个单元格中我有另一个表格(称为 T)，在第二个单元格中有一些内容(称为 C)，请参阅 http://jsfiddle.net/mcJvU/ .

<table>
    <tr><td>
<table class="table table-striped">
    <thead>
        <th>a</th>
        <th>b</th>
        <th>c</th>
        <th>d</th>
        <th>e</th>
        <th>f</th>
    </thead>
    <tbody>
        <tr><td>1</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>2</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>3</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>4</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>5</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>6</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>7</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>8</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>9</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
        <tr><td>10</td><td>m</td><td>n</td><td>o</td><td>p</td><td>q</td></tr>
    </tbody>
</table>
        </td>
        <td>
            some<br/>
            big<br/>
            enough<br/>
            content<br/>
            but<br/>
            may<br/>
            be<br/>
            empty
        </td>
    </tr>
</table>

重要的是:T 必须包含大量行，而 C 没有太多内容，它可能是空的。

我希望 T 占据所有可用位置，或者如果 C 较小，则至少打印 3 行。

我试过 fixedheadertable 但它是一个固定大小的高度并且它有一些错误。

编辑:“至少打印 3 行”，我的意思是 T 必须有一个允许显示至少三行的最小高度。

Answer 1

最后我用纯 CSS 修复了它。

多亏了这个:Twitter Bootstrap scrollable table rows and fixed header

然后我就没有更多的打印问题了。