安排第一半左邊和 rest 右邊

Question

前半段左后半段如何排列？ （而不是第一個向左，第二個向右，第三個讓，第四個向右等等）

Javascript：

  do {
    document.querySelector("main").innerHTML += 
      "<div class='timeTable'>" + 
      tempTime.format("DD-MM-YY | HH:mm") + 
      " - " + tempTime.add(30, "minutes").format("HH:mm") + 
      "</div>";
  } while (tempTime.format("HH:mm") != "19:00");

CSS：

* {
  box-sizing: border-box;
}
.timeTable {
  width: 50%;
  float: left;
  text-align: center;
}

PS：順便說一句 tempTime 是一個 momentjs object （這與問題無關，以防萬一有人想知道）

Answer 1

找到了：

main {
        display: grid;
        grid-template-columns: auto auto;
        grid-template-rows: repeat(9,auto);
        grid-auto-flow: column;
    }

由於 18 個框而重復（9，auto）...除以 2 是 9