Как поставить последний элемент grid сетки посередине?

Question

[igoryusha22]

Как универсально поставить последний элемент посередине?

Следующий вариант не подойдет т.к. если добавить 10 элемент, то он будет выбит, а нужно чтобы он встал как остальные.

.grid__elem:last-child {
  grid-column: span 2
  margin: auto
}

https://codepen.io/ithater/pen/rNLPxLK?editors=1100

Comments

[Froggyweb]

в данном случае можно испльзоваnь flex или он уже запрещен? можно доже инлайн-блок

Answer 1

[xdevelx]

В данном конкретном случае можно указать селектор для последнего элемента, уточнив, что он нечетный:

&__elem:nth-child(2n + 1):last-child 
  grid-column: span 2
  margin: auto

Comments

[igoryusha22]

@develx
А как быть, когда уже по 3 блока в ряду, и нужно размещать блоки по центру, когда в ряду 1 или 2 блока?

[xdevelx]

1thater, Продолжать делать комбинации селекторов last-child и nth-child или использовать flexbox.