Html缩放行

Question

我有一个包含此布局

的表格

如您所见，左侧的第一行相应地缩放为“Notes”列。如何使左行高度相同？像这样：

这是我的布局小提琴。 http://jsfiddle.net/CleverKetchup/nhe26e8y/

代码：

<table cellspacing="1" cellpadding="5" width="100%" border="1">
    <tr>
        <td rowspan="2">ARRIVAL<br/>ATIS 1</td>
        <td rowspan="2"></td>
        <td colspan="5">NOTES</td>
    </tr>

    <tr>
        <td colspan="5" rowspan="3">SELECTED PROFILES:</td>
    </tr>

    <tr>
        <td>ARRIVAL<br/>ATIS 2</td>
        <td></td>
    </tr>

    <tr>
        <td>ALT<br/>ATIS</td>
        <td></td>
    </tr>
</table>

Answer 1

解决方案1：css溢出

为什么不在注释内容td{ overflow:auto; }中使用css <td>？

解决方案2：嵌入式表

为什么不在另一张桌子内使用桌子？这样，您可以轻松地使用css？

独立控制行宽/高度

即：

<table cellspacing="0" cellpadding="0">
    <tr>
        <td class="td1">
            <!-- TABLE 1 -->
            <table cellpadding="5" class="table1" height="300px" border="1" width="100%">
                <tr>
                    <td class="tdata">
                        ARRIVAL<br />
                        ATIS 1
                    </td>
                    <td class="tdata">
                        data of ATIS 1
                    </td>
                </tr>
                <tr>
                    <td class="tdata">
                        ARRIVAL<br />
                        ATIS 2
                    </td>
                    <td class="tdata">
                        data of ATIS 2
                    </td>
                </tr>
                <tr>
                    <td class="tdata">
                        ALT<br />
                        ATIS
                    </td>
                    <td class="tdata">
                        data of ATIS
                    </td>
                </tr>
            </table>
        </td>
        <td class="td2">
            <!-- TABLE 2 -->
            <table cellpadding="5" border="1" class="table2" height="300px" width="100%">
                <tr>
                    <td class="tnotes" height="32px" width="100%">
                        NOTES
                    </td>
                </tr>
                <tr>
                    <td colspan="5">SELECTED PROFILES:
                        SELECTED PROFILES:

                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>