Заставьте родителей расширить ширину ребенка с «дисплеем: сетка» [дублировать] ⇐ Html

[Anonymous]

edit: не уверен, что это дубликат? Я не хочу, чтобы цвет фона простирался после ширины контейнера, я хочу, чтобы контейнер расширился до размера его дисплея: Grid ряд. Обновлено пример, чтобы лучше объяснить мою проблему. Я сделал это для использования minmax () < /code> каждой ячейки, чтобы сделать всю таблицу прокручивать, когда ее ячейки больше не могут сокращаться, в то же время позволяя таблице расти, если будет доступно больше места. < /P>

Это работает нормально, кроме того, что стиль для строк применяет только к ширине контейнера. />

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

.container {
width: 430px;
background: grey;
overflow-x: scroll;
}

.row {
display: grid;
grid-template-columns: minmax(200px, 1fr) minmax(200px, 1fr) minmax(200px, 1fr) minmax(100px, 1fr);
background: red;
height: 3rem;
margin: 0.5rem;
}

.cell {
border: 1px solid black;
}< /code>
Scroll to the right inside the box:


cell 1
cell 2
cell 3
cell 4

cell 1
cell 2
cell 3
cell 4


Elements with the .row

class should expand to fit all the cells.< /code>
< /div>
< /div>
< /p>

Есть ли способ решить это? Я в порядке с добавлением дополнительных элементов, если это необходимо!


Подробнее здесь: https://stackoverflow.com/questions/556 ... splay-grid