2021-06-15 16:21:20 +02:00
---
id: 587d78a3367417b2b2512ad0
2021-06-28 20:01:36 +05:30
title: Centralizar um elemento horizontalmente usando a propriedade margin
2021-06-15 16:21:20 +02:00
challengeType: 0
videoUrl: 'https://scrimba.com/c/cyLJqU4'
forumTopicId: 301043
dashedName: center-an-element-horizontally-using-the-margin-property
---
# --description--
2021-06-28 20:01:36 +05:30
Outra técnica de posicionamento é centralizar um elemento de bloco horizontalmente. Uma maneira de fazer isso é definir a propriedade `margin` para o valor "auto".
2021-06-15 16:21:20 +02:00
2021-06-28 20:01:36 +05:30
Esse método também funciona para imagens. Imagens são elementos inline por padrão, mas podem ser alterados para elementos de bloco caso você defina o valor da propriedade `display` para `block` .
2021-06-15 16:21:20 +02:00
# --instructions--
2021-06-28 20:01:36 +05:30
Centralize a `div` na página adicionando a propriedade `margin` com o valor `auto` .
2021-06-15 16:21:20 +02:00
# --hints--
2021-06-28 20:01:36 +05:30
Esta `div` deve conter a propriedade `margin` definida com o valor `auto` .
2021-06-15 16:21:20 +02:00
```js
2021-09-24 06:31:25 -07:00
assert(new __helpers.CSSHelp(document).getStyle('div')?.margin === 'auto');
2021-06-15 16:21:20 +02:00
```
# --seed--
## --seed-contents--
```html
< style >
div {
background-color: blue;
height: 100px;
width: 100px;
}
< / style >
< div > < / div >
```
# --solutions--
```html
< style >
div {
background-color: blue;
height: 100px;
width: 100px;
margin: auto;
}
< / style >
< div > < / div >
```