---
id: 5a94fe1369fb03452672e45d
title: Place Items in Grid Areas Using the grid-area Property
challengeType: 0
videoUrl: ''
localeTitle: Colocar itens em áreas de grade usando a propriedade de área de grade
---
## Description
Depois de criar um modelo de áreas para seu contêiner de grade, conforme mostrado no desafio anterior, você pode colocar um item em sua área personalizada fazendo referência ao nome que você deu a ele. Para fazer isso, você usa a propriedade de grid-area
em um item como este: .item1 {grid-area: cabeçalho; }
Isso permite que a grade saiba que você deseja que a classe item1
vá para a área denominada header
. Nesse caso, o item usará a linha superior inteira porque essa linha inteira é nomeada como a área do cabeçalho.
## Instructions
Coloque um elemento com a classe item5
na área de footer
usando a propriedade grid-area
.
## Tests
```yml
tests:
- text: item5
classe item5
deve ter uma propriedade de grid-area
que tenha o valor de footer
.
testString: 'assert(code.match(/.item5\s*?{[\s\S]*grid-area\s*?:\s*?footer\s*?;[\s\S]*}/gi), "item5
class should have a grid-area
property that has the value of footer
.");'
```
## Challenge Seed
## Solution
```js
// solution required
```