css - 如何更改网格的订单方向？

<分区>

我有这样的网格；

我想从上到下而不是从左到右排列数字。 (我想要最后一栏的蓝调)

.grid {
  display: grid;
  grid-gap: 1em;
  grid-template-columns: repeat(3, calc((100% / 3) - calc(2em / 3)));
  grid-auto-flow: row;
}

我怎样才能做到这一点？

最佳答案

如果我答对了，您需要每隔 12 个元素，然后在新的一行中继续。我会尝试，给所有元素相同的类，并使用 nth-child(12n) 和 grid-column-start: 1;。

.grid-item-device-type-1:nth-child(12n) {
  /* height: 180px; */
  /* min-width: 320px; */
  grid-column-start: 1;

}

希望对你有帮助:)

关于css - 如何更改网格的订单方向？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56191705/

相关文章：

html - 无法在CSS网格中创建一列