CSS GRID принимает ширину всех детей, а не просто колонны ⇐ Html

[Anonymous]

У меня есть эта сетка CSS, которая течет вертикально и завершается новой колонке, когда первая заполнена. Я ожидал, что ширина этого элемента сетки будет лишь шириной его столбцов. Однако, похоже, он принимает сумму ширины всех своих детей. Это не похоже на правильное поведение. < /P>
Как я могу убедиться, что сетка получает только ширину его столбцов?

Код: Выделить всё

.parent {
display: flex;
flex-direction: column;
align-items: center;
}

.grid {
border: 1px solid black;
height: 200px;
display: grid;
grid-auto-flow: column;
grid-template-rows: repeat(auto-fit, 35px);
grid-auto-columns: min-content;
}

.grid > * {
display: flex;
border: 1px solid gray;
}< /code>

label

1aaaaa
2aaa
3aa
4a
5aa
6aa
7a

< /code>
< /div>
< /div>
< /p>
Следующим будет ожидаемым поведением, но я бы хотел, чтобы родитель был Clembox Class. PrettyPrint-Override ">.grid {
border: 1px solid black;
height: 200px;
display: grid;
width: min-content;
grid-auto-flow: column;
grid-template-rows: repeat(auto-fit, 35px);
grid-auto-columns: min-content;
}

.grid > * {
display: flex;
border: 1px solid gray;
}< /code>

label

1aaaaa
2aaa
3aa
4a
5aa
6aa
7a

Подробнее здесь: https://stackoverflow.com/questions/795 ... st-columns