CSS - Показать плоский список div в группах по 8 - PullRequest
Новая
       21

CSS - Показать плоский список div в группах по 8

1 голос
/ 24 июня 2019

Я хотел бы отобразить сетку чисел в группах по 8. Например, допустим, у нас есть 32 деления - каждое с числом: 

1  9   17  25
2  10  18  26
3  11  19  27
4  12  20  28
5  13  21  29
6  14  22  30
7  15  23  31
8  16  24  32

То, с чем я борюсь, этоперенести его на следующую строку, когда не хватает ширины.Если ширины недостаточно, я бы хотел, чтобы она выглядела следующим образом: 

1  9   17
2  10  18
3  11  19
4  12  20
5  13  21
6  14  22
7  15  23
8  16  24

25
26
27
28
29
30
31
32

Я пытаюсь использовать сетку CSS, но не могу перенести ее на следующую строку, когда это необходимо.Число делений всегда будет повторением 8.

Мой класс CSS для сетки: 

.grid {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(8, 1fr);
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}

Fiddle: https://jsfiddle.net/6grct3no/

...