将表格单元格包装在拐角处与表格行相同，并与另一个表格中的不均匀单元格对齐

Question

我有两个表格，每列两列 - 每个tr两个td元素。假设第一个表的最后一个tr只有一个td元素，那么末尾将会有一个空格。你可以用colspan="2"来解决这个问题。但是，目标是让下一个表的第一个单元格与第一个表格的最后一个单元格一致。

要使用代码段示出它：我想表2中，小区1为在同一行上如表1，小区3。

#container{ 
 
    width: 160px; 
 
    background-color: orange; 
 
    color: blue; 
 
    zoom: 3.5; /* better visibility */ 
 
} 
 

 
td{ 
 
    border: 1px solid black; 
 
    width: 80px; 
 
    overflow: hidden; 
 
} 
 

 
#table-2{ 
 
    color: green; 
 
}

<div id="container"> 
 
    <table id="table-1"> 
 
    <tr> 
 
     <td>Table 1, Cell 1</td> 
 
     <td>Table 1, Cell 2</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Table 1, Cell 3</td> 
 
    </tr> 
 
    </table> 
 
    
 
    <table id="table-2"> 
 
    <tr> 
 
     <td>Table 2, Cell 1</td> 
 
     <td>Table 2, Cell 2</td> 
 
    </tr> 
 
    </table> 
 
</div>

Answer 1

假设你真的想两个表，如果你动表2，小区1到表1，那么它是表的部分不再2.

唯一这样做你所问的是：

1. 手动将表2，表1单元1中的HTML内（并且从那里继续格局; Y我们决定你是否真的需要两张表或者强调大的表），或者

2. 使用服务器端框架（例如， MVC，PHP，JSP等）来确保每列都被填充，而不管它在哪个表中。