столбец макета сетки CSS

Question

Я пытаюсь создать макет с 5 столбцами, используя сетку CSS. Первый и последний столбцы должны иметь пробел.
Я пытаюсь создать его, но как-то получается три строки вместо столбцов.

.grid_container{
    grid-template-columns: 1fr 2fr 4fr 2fr 1fr;
    grid-template-areas: ". A B C ."
}

#column1 {
    grid-area: A;
    background:red;
    padding: 100px;
}

#column2 {
    grid-area: B;
    background:blue;
}

#column3{
    grid-area: C;
    background: orange;
}

У меня есть 5 столбцов, но первый и пятый столбцы должны иметь пробелы.

Answer 1

Вам не хватает самого важного свойства display: grid. Пример в CodePen Сетка столбцов . Ура, Зигфрид.