0

有没有办法让一列中嵌套表的行与另一列中嵌套表的行具有相同的高度?

<tr>
    <td>1</td>
    <td>123 Technologies</td>
    <td>
        <table>
            <tbody>
                <tr>
                    <td>Item 1</td>
                </tr>
                <tr>
                    <td>Item 2</td>
                </tr>
                <tr>
                    <td>Item 3</td>
                </tr>
            </tbody>
        </table>
    </td>
    <td>
        <table>
            <tbody>
                <tr>
                    <td>Blah blah blah</td>
                </tr>
                <tr>
                    <td>Blah blah blah</td>
                </tr>
                <tr>
                    <td>Blah blah blah</td>
                </tr>
            </tbody>
        </table>
    </td>
</tr>

jsfiddle 链接:http: //jsfiddle.net/XXmPH/

我想将项目 1 与下一列中的对应 tr 对齐,将项目 2 与其下一列中的 tr 对齐,依此类推。

我很确定我可以用 JavaScript 做到这一点,但我认为这不是一个好主意,因为该表将加载数百行。

4

2 回答 2

0

如果可以更改布局:

<tr>
    <td>1</td>
    <td>123 Technologies</td>
    <td colspan="2">

        <table>
            <tbody>
                <tr>
                    <td style="width: 50%">Item 1</td>
                    <td>Blah blah blah</td>
                </tr>
                <tr>
                    <td>Item 2</td>
                    <td>Blah blah blah</td>
                </tr>
                <tr>
                    <td>Item 3</td>
                    <td>Blah blah blah</td>
                </tr>
            </tbody>
        </table>
    </td>
</tr>

否则,我认为需要JS

于 2013-06-18T07:07:01.830 回答
0

尽管您已经接受了一个答案:玛丽的答案有一个缺点,即列将不再与列标题对齐。最好不要嵌套表格,而是使用rowspan

<tbody>
    <tr>
        <td rowspan=2>2</td>
        <td rowspan=2>XYZ Industries</td>
        <td>Scope X</td>
        <td>Description X</td>
    </tr>
    <tr>
        <td>Scope Y</td>
        <td>Description Y.</td>
    </tr>
</tbody>

http://jsfiddle.net/XXmPH/1/

于 2013-06-18T09:00:32.720 回答