Свойство CSS margin (Отступы вокруг элемента)

7:19 10.03.2017
Свойство margin - устанавливает отступы вокруг элемента, то есть с четырех сторон (верхняя сторона, правая сторона, нижняя сторона и левая сторона).

Используя пример ниже , элемент с классом xxx будет иметь отступы вокруг себя на 5 пикселей.
.xxx {
    margin: 5px;
}

Так же, при помощи margin, можно установить отступы для каждой стороны свои, например, так:
.xxx {
    margin: 5px 10px 15px 20px;
}

Отступы вокруг элемента будут присвоены в таком порядке:
  • Верхний отступ: 5px
  • Правый отступ: 10px
  • Нижний отступ: 15px
  • Левый отступ: 20px

Код из второго примера можно написать ещё вот так:
.xxx {
    margin-top: 5px;
    margin-right: 10px;
    margin-bottom: 15px;
    margin-left: 20px;
}