html - HTML 表格单元格在内容调整大小时调整大小

Question

这是jsFiddle。

这是代码：

<table>
  <tr>
    <td id="td00" rowspan="2">
        <textarea>A very1 </textarea>
    </td>
    <td id="td01"> 
        <textarea>A very2 </textarea>
    </td>        
  </tr>
  <tr>
    <!--td>
        <textarea>A very3 </textarea>
    </td-->
    <td>
        <textarea>A very4 </textarea>
    </td>        
  </tr>
</table>

的CSS：

table, td
{ 
  border:1px solid black;  
}

table 
{
  height:400px;
  width:400px;
  table-layout:fixed;
}
#td01, #td00 
{
  height:100%;
}

当我更改 row = 0 和 col = 0 的单元格内的 textarea 时，row = 1 和 col 1 的单元格也在改变。

我需要固定单元格的大小。

Answer 1

这并不完美，但我认为它会做你想做的事，你必须为 td 设置一个固定位置和一个固定高度，所以我不知道你是否同意你的项目。

HTML：

<table>
    <tr>
        <td id="td00" rowspan="2">
            <textarea>A very1 </textarea>
        </td>
        <td id="td01"> 
            <textarea>A very2 </textarea>
        </td>        
    </tr>
    <tr style="position:fixed;">
        <!--td>
            <textarea>A very3 </textarea>
        </td-->
        <td >
            <textarea>A very4 </textarea>
        </td>        
    </tr>
</table>

CSS：

   table, td{ 
    border:1px solid black;  
}

table {
    height:400px;
    width:400px;
    table-layout:fixed;
}
#td01
{
    height:320px;
}

示例：小提琴