grid-area

grid-area: <grid-row-start> / <grid-column-start> / <grid-row-end> / <grid-column-end> | <custom-ident>

📝 Описание

Сокращённая запись для всех четырёх свойств grid-row/column или имя области.

Значение по умолчанию: auto / auto / auto / auto

🎯 Возможные значения

  • Четыре значения через слэш
  • Имя области из grid-template-areas
.header {
  grid-area: header;
}

.item {
  grid-area: 1 / 1 / 3 / 3;
}

🌐 Поддержка браузеров

Все современные браузеры

📚 Подробнее

Подробнее об этом свойстве вы можете узнать в нашем руководстве: Полное руководство по CSS Grid