From 68fc8e96a9629e73469ed457abd955e548ec670c Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:49:58 +0100 Subject: unslug pt-br: move --- files/pt-br/glossario/grid_areas/index.html | 78 ----------------------------- 1 file changed, 78 deletions(-) delete mode 100644 files/pt-br/glossario/grid_areas/index.html (limited to 'files/pt-br/glossario/grid_areas/index.html') diff --git a/files/pt-br/glossario/grid_areas/index.html b/files/pt-br/glossario/grid_areas/index.html deleted file mode 100644 index 0e9969dd3d..0000000000 --- a/files/pt-br/glossario/grid_areas/index.html +++ /dev/null @@ -1,78 +0,0 @@ ---- -title: Grid Areas -slug: Glossario/Grid_Areas -translation_of: Glossary/Grid_Areas ---- -

Um  grid area  é um ou mais {{glossary("grid cell", "grid cells")}} que compõem uma área retangular do grid.  As Grid Areas quando se coloca um item  usando line-based placement (posicionamento baseado em colunas e linha)ou quando define áreas usando named grid areas(substituindo o nome).

- -

Image showing a highlighted grid area

- -

Áreas do Grid devem ser de natureza regutangular; não é possível criar por exemplo uma área de grid em forma de T ou L .

- -

No exemplo abaixo temos um grid contêiner com dois items de grid, nomeamos esses com a propriedade {{cssxref("grid-area")}} e em seguida colocamos eles no grid usando {{cssxref("grid-template-areas")}}. Isso  cria duas áreas de grid, uma cobrindo 4 áreas do grid e a outra duas áreas do grid.

- -
- - -
.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3,1fr);
-  grid-template-rows: 100px 100px;
-  grid-template-areas:
-    "a a b"
-    "a a b";
-}
-.item1 {
-  grid-area: a;
-}
-.item2 {
-  grid-area: b;
-}
-
- -
<div class="wrapper">
-   <div class="item1">Item</div>
-   <div class="item2">Item</div>
-</div>
-
- -

{{ EmbedLiveSample('example_1', '300', '280') }}

-
- -

Saiba Mais

- -

Property reference

- - - -

Further reading

- - -- cgit v1.2.3-54-g00ecf