main
grid-template-columns: 1fr repeat( 100, auto);
/* для каждого столбца указываем какие линии нужно использовать.*/
main{ display: grid;
rid-template-columns: [start] 1fr [line1] auto [line2] auto [line3];
}
.name{ /*Колонка постоянная*/
grid-column: start / line1;
}
.count{ /* Колонка Опциональная*/
grid-column: line1 / line2;
}
.summ{ /*Колонка Опциональная*/
grid-column: line2 / line3;
}
.tax{ /*Блок во всю ширину всех колонок, как COLSPAN (с любым количеством колонок)*/
grid-column: start / line3;
}
main{ display:grid;
grid-template-columns: 1fr auto auto auto;
grid-template-areas: "name count cost summ";
}
<table>
.rowspan{
grid-column: line4 / line5;
grid-row: 1 / 100;
}
<TABLE >
?<div class='count'>3</div>
. Но заранее не известно будет ли эта колонка или не будет. <td class='count'>3</td>
либо не генерируем. Но при этом таблица растягивается с учетом третьей колонки либо без учета. Но растягивается.grid-template-rows: repeat(2, 1fr);
, если в примере четко видно что там перечисление, и четко написано 3 точки.