如何使用HTML5，CSS3删除列中的空格

Question

有多列可以动态获取数据。因此，具有更多数据的列将占据整个高度。同一行中的其他列也将消耗最大高度（即使它们没有太多数据）因此，会留下空白空间。如何删除此空白区域。

 <td style="text-align: center;height:100%;">
 <table style="border-collapse:collapse; margin: -6px -14px -7px -11px; 
width:100%;height:100%;>
<tr>
    <td style="height:100%;" >
        <table  style="width:100%;height:100%" ><tr > 
            <td height="100%" ng-repeat="--">
                -- multiple div and span blocks used to loop multiple times- 
        </td></tr></table>

Answer 1

我知道在表格中“未对齐”细胞分离的唯一方法是使用colspan和rowspan，但这些功能只能将细胞融合在一起，而不是创建一个孤立的细胞（孤立的）从某种意义上说，即使它对应的行或列，它也会有自己的尺寸。

如果理论上您的布局可以使用table，那么将涉及大量代码以使这些单元格融合正常并且可能需要javascript来进行尺寸标注。

rowspan：

的例子

<table border="1">
  <tr>
    <td rowspan="2">A</td><td>B</td><td>C</td>
  </tr>
  <tr>
    <td rowspan="2">B</td><td>C</td>
  </tr>
  <tr>
    <td>A</td><td>C</td>
  </tr>
</table>

总之，如果要模拟行或列，则使用div可以更轻松地完成布局，并最终使用包装器div。这也可以更快地呈现，table现在被认为是组织布局的不好选择。