Как управлять колонками в css grid layout?

Question

[Underdoggit]

Вопрос: Есть грид раскладка, понимаю все, кроме как задать ширину колонки на определенном row. Если задаю grid-template-columns: он создает новые колонки. Как задавать колонкам явные размеры в определенном row? Допустим 1ый row - 1 колонка которая сейчас тянется по автомату на 1fr - задать ей ширину 2х колонок. Во втором row колонкам задан явный размер и grid-gap.

.example-calculation__left-block
    display: grid
    grid-template-rows: auto auto auto
    grid-template-areas: "ect ect ect" "ecdw ecdw ecdw" "eccw eccw eccw"

.example-calculation__title
    grid-area: ect

.example-calculation__data-wrapper
    grid-area: ecdw

.example-calculation__cost-wrapper
    grid-area: eccw

Answer 1

[Анатолий]

Смысл CSS Grid как раз в том, что в каждой строке одинаковое кол-во ячеек. Можно объединять несколько из них, можно выводить свои дочерние элементы не с первой ячейки ряда, но сделать разные ширины ячеек разных рядов - нельзя, это против концепции грида (здесь примерно как в Excel относительно строк и столбцов).
подробнее см. здесь

Comments

[Underdoggit]

Спасибо, почитаю.