javascript - 匹配父表和子表单元格的行高

我桌子内有一个儿童桌子。有用于插入新表的行跨度。

现在我的问题是，当主表单元格的内容增加时，各个单元格的子行也应扩展。

这是表格结构

<table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td>Col 1</td>
            <td>Col 2</td>
            <td rowspan="3">
              <table border="0" class="child_table" cellspacing="0" cellpadding="0">
                <tr>
                  <td>Sub col 1</td>
                  <td>Sub col 2</td>
                </tr>
                <tr>
                  <td>Sub col 1</td>
                  <td>Sub col 2</td>
                </tr>
              </table>
            </td>
            <td>Col 4</td>
   </tr>
       <tr>
            <td>Col 1</td>
            <td>Col 2</td>
            <td>When the content of this cell increases I want the 2nd (respective) row of child table also to extend accordingly.</td>
   </tr>
        <tr>
            <td>Col 1</td>
            <td>Col 2</td>
            <td>Col 4</td>
   </tr>
  </table>

FIDDLE

最佳答案

jsBin demo

table{
  background:#C2E5FF;
  position:relative;
    height:100%;  /* Set 100% height */
}
td{
  border:1px solid #ccc;
  vertical-align:top;
  width:20%
                  /* Don't use height */
}
.child_table{
  background:#FFFFCA;
    width:100%;  /* Set width to 100% */
}

关于javascript - 匹配父表和子表单元格的行高，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25156741/