如何将一个 html 表格并排分成两部分？

【问题标题】：How to have one html table split into two sections, side by side?如何将一个 html 表格并排分成两部分？
【发布时间】：2014-01-26 22:00:03
【问题描述】：

我想要一个表格来显示一半的行，然后将另一半行环绕并水平显示在它旁边，而不是有一个长的垂直表格。

我正在使用 angular 并且希望能够将一组数据绑定到一个表，但让它像描述的那样水平跨越两个部分。两个表是一个选项，但这意味着我必须添加更多我希望尽可能避免的逻辑。即，对于排序 Id，必须将数据集重新连接在一起并对它们进行排序，然后再次拆分。

任何指针表示赞赏。

【问题讨论】：

您知道您将拥有多少列吗？如果是，您可以向每个第 n 个单元格添加一个类，并更改样式，使其看起来像之间有一个空格。边框、bgs 等。编辑：问题可能是您如何将数据添加到表中以很好地拆分它。

【解决方案1】：

你可以试试CSS3 multi-column layouts。这通常不适用于表格（并且不能直接用于表格），但是如果您将表格放入具有类似

样式的 DIV 容器中

#container {
    column-count:2;
    -moz-column-count:2;
    -webkit-column-count:2;
}

这可能是你需要的。

更新：以上内容似乎只适用于 WebKit 浏览器（Chrome、Opera、Safari）。 FF/IE 可能需要不同的方法。

【讨论】：