css - 在 CSS 中重新排列表格

Question

我有一个包含 2 列的表格，如下所示。我想重新排列/打破表格，例如在 2 行之后，以便以下行在右侧继续。

[1][2]     [1][2][5][6]
[3][4] =>  [3][4][7][8]
[5][6]
[7][8]

这在纯 CSS 中可能吗？

在 HTML 代码中更改它不是一个选项。 仅在普通浏览器中运行的解决方案是可以接受的。

编辑:
Fiddle .

我想在 9 行(一半)后打破表格。
在示例中:在包含“strict2”的行之后换行，以便包含“basic3”的行紧挨着包含“basic”的行。

编辑2:
由于无法使用 CSS 解决方案，因此我使用 JS 解决方案来打破表格。

Answer 1

您可以在计数到 9 后拆分行，然后在新表中显示其余部分

JS:

$(document).ready(function () {
    var $secLevelTable = $(".secLevelTable");
    var splitBy = 9;
    var rows = $secLevelTable.find("tr").slice(splitBy);
    var $secondTable = $(".secLevelTable").parent().append("<table class='secondTable'><tbody></tbody></table>");
    $secondTable.find("tbody").append(rows);
    $secLevelTable.find("tr").slice(splitBy).remove();
});

UPDATED FIDDLE