css властивість margin-top

CSS властивість margin-top встановлює відступ від верхнього краю елемента.

Відстань встановиться від верхнього краю поточного елемента до внутрішнього краю батьківського елемента.

Властивість може отримувати в якості значення, як довжину так і відсотки та ключове слово auto. Значення може бути від'ємне. У цьому випадку елементу буде розташований ближче до сусідніх елементів.

Зона для margin знаходиться поза межами(border), які в свою чергу знаходяться поза полями(padding).

правити

Нотатка

Вертикальні відступи двох елементів можуть об'єднуватися.

автор: NagarD правити

Нотатка

Ця властивість не впливає на незамінні вбудовані елементи, такі як <tt>, <span> чи <code>. Застосовується до всіх елементів, крім елементів із типами відображення таблиці, відмінними від table-caption, table і inline-table. Вона також не впливає на ::first-letter та ::first-line.

автор: NagarD правити

+ додати пораду чи нотатку

Синтаксис

margin-top: length|auto|initial|inherit;

Властивість margin-top може отримувати 4 значень:

length

Величину верхнього відступу можна вказувати в пікселях (px), відсотках (%) або інших допустимих для CSS одиницях. Значення може бути додатнім та від'ємним.

автор: NagarD

правити

auto

Вказує, що розмір відступів буде автоматично розрахований браузером.

автор: NagarD

правити

initial

Встановлює цю властивість в значення без задання

автор: NagarD

правити

inherit

Успадкує значення властивості від свого батьківського елемента

автор: NagarD

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
margin-top	1.0	1.0	1.0	3.5	6.0

Підтримка: мобільні переглядачі

Переглядач
margin-top	1.0	1.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

<p>Звичайний абзац.</p>
<p class="m">Цей абзац відсунуто на 2см згори.</p>

p {
    border: 1px solid #0172ad;
    margin: 0;
    padding: 6px;
}

.m {
    margin-top: 2cm;
}