freeCodeCamp/curriculum/challenges/ukrainian/01-responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property.md

id, title, challengeType, videoUrl, forumTopicId, dashedName

id	title	challengeType	videoUrl	forumTopicId	dashedName
587d78a3367417b2b2512ad0	Вирівнювання елемента горизонтально по центру з використанням властивості margin	0	https://scrimba.com/c/cyLJqU4	301043	center-an-element-horizontally-using-the-margin-property

--description--

Ще однією технікою вирівнювання є розташувати блок-елемент горизонтально по центру. Одним зі способів це зробити є встановити властивість margin для значення "auto".

Цей метод працює і для зображень. Зображення є вбудованими (inline) елементами за замовчуванням, але їх можна зробити елементами-блоками, якщо надати властивості display значення block.

--instructions--

Відцентруйте div на сторінці, додавши margin властивість із значенням auto.

--hints--

Властивість margin для div потрібно встановити на auto.

assert(new __helpers.CSSHelp(document).getStyle('div')?.margin === 'auto');

--seed--

--seed-contents--

<style>
  div {
    background-color: blue;
    height: 100px;
    width: 100px;

  }
</style>
<div></div>

--solutions--

<style>
  div {
    background-color: blue;
    height: 100px;
    width: 100px;
    margin: auto;
  }
</style>
<div></div>