Автосовые ряды, размеры по содержанию с использованием сетки CSS ⇐ CSS

[Anonymous]

У меня есть две сетки, вложенные в сетку. К сожалению, правая вложенная сетка. Грид-3 устанавливает высоту строк, чтобы как левая, так и правая сетка была одинаковой высотой, дополнительное пространство делится среди DIV с классом .right . Как я могу установить ряды правой вложенной сетки, чтобы приспособиться к размеру содержания, поэтому они имеют такую же высоту, что и левые вложенные ряды?

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

div {
border: 1px dotted black;
}
.grid-2 {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-auto-rows: auto;
}

.grid-3 {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-auto-rows: auto;
}

.left {
background-color: red;
}

.right {
background-color: green;
}< /code>


L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L


R
R
R
R
R
R
R
R
R
R
R
R
R

Подробнее здесь: https://stackoverflow.com/questions/497 ... g-css-grid