Код: Выделить всё
.grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: 100px;
grid-auto-rows: 60px;
grid-gap: 15px;
}
.col {
background-color: tomato;
}Код: Выделить всё
При этом создаются 2 строки: первая имеет высоту 100 пикселей, вторая автоматически создается с высотой 60 пикселей. 2 столбца во второй строке имеют ширину 1fr.
Можно ли с помощью CSS Grid/Flexbox горизонтально центрировать 2 столбца во 2-й строке? Т.е. иметь различное количество столбцов в строке.
Я застрял, пытаясь решить тривиальный вариант использования платформы CSS Grid в браузере. Этого довольно легко достичь, если вы создаете сетки с помощью Flexbox.
Но могу ли я добиться этого с помощью CSS Grid?
Вот демо-версия CodePen того, чего я пытаюсь достичь.
Подробнее здесь: https://stackoverflow.com/questions/476 ... a-css-grid
