Как сделать отступ от блока в css

Вы можете добавить отступ от блока в CSS, используя свойство margin. Отступы могут быть заданы для каждой стороны элемента в отдельности или для всех сторон сразу.

Синтаксис для задания отступа от элемента:

селектор {
  margin: значение;
}

Значение может быть задано в различных форматах, например, в пикселях, процентах, em и т.д.

При использовании одного значения в свойстве margin, отступ будет задан для всех сторон элемента одновременно:

.my-block {
  margin: 20px;
}

Вы также можете задать разные значения для разных сторон элемента, используя свойства margin-top, margin-bottom, margin-left, или margin-right:

.my-block {
  margin-top: 10px;
  margin-right: 20px;
  margin-bottom: 10px;
  margin-left: 20px;
}

Как и с отдельными свойствами, значения могут быть указаны в разных форматах и вы можете выбрать тот, который наиболее подходит для вашей ситуации.

Некоторые другие примеры значений margin:

.my-block {
  margin: 10px 20px; /* задаем отступ сверху/снизу и слева/справа */
}

.my-block {
  margin: 5% 10%; /* задаем проценты для отступов вверху/внизу и слева/справа */
}

.my-block {
  margin: 0 auto; /* задаем автоматические отступы сверху/снизу и выравниваем по горизонтали */
}

Вы можете играть со значениями, чтобы получить подходящий вам отступ для вашего блока.