---
title: "Отступы и размеры: padding, margin, block spacing"
description: "Управление пространством в блочном редакторе WordPress: padding, margin и block spacing — глобальные настройки и индивидуальные значения."
---

## Три инструмента управления пространством

В блочном редакторе доступны три ключевых инструмента для управления расстояниями:

| Инструмент | Где действует |
|---|---|
| **Padding** | Внутренний отступ — пространство между контентом и границей блока |
| **Margin** | Внешний отступ — пространство между блоком и соседними элементами |
| **Block spacing** | Расстояние между вложенными блоками внутри контейнера (Group, Columns) |

## Как открыть настройки

1. Выберите блок
2. Settings (боковая панель справа) → **Styles** → **Dimensions**
3. Если padding/margin не видны: три точки → включить в списке

## Padding

### Настройка
- **Горизонтальный + вертикальный** слайдеры (от 0 до XXL)
- **Кастомные значения** с единицами: `px`, `%`, `rem`, `em`, `vh`, `vw`
- **Unlink sides** — раздельная настройка top/right/bottom/left

### Когда использовать
- Кнопки с текстом внутри — горизонтальный и вертикальный padding
- Карточки — padding вокруг контента
- Секции с фоном — padding, чтобы контент не прилипал к краям

## Margin

### Настройка
- Те же контролы, что у padding
- **Отрицательные значения** — доступны в расширенных настройках (advanced)

### Когда использовать
- Добавить «воздуха» между секциями
- Расстояние между header и контентом
- Точная настройка позиционирования

## Block spacing

Block spacing — специфичный для контейнеров параметр, управляющий расстоянием между вложенными блоками.

### Когда использовать
- **Установить в 0** — «склеить» элементы (например, изображения в галерее без зазоров)
- Настроить горизонтальное расстояние между элементами в Group/Row
- Управлять вертикальным ритмом внутри секций

## Глобальные значения через Style Book

Можно задать дефолтные padding, margin и block spacing для типов блоков глобально:

- **Media → Media & Text** — добавить вертикальный padding
- **Design → Buttons** — горизонтальный + вертикальный padding
- **Layout** — вертикальный padding для основной области контента, block spacing

## Практические примеры

1. **Сетка без зазоров:** вставить паттерн → Grid block → spacing = XS
2. **Просторные колонки:** паттерн → Columns → padding = XX-Large
3. **Кнопка с отступами:** Buttons «Learn more» → горизонтальный padding 10px, вертикальный 20px
4. **Секции друг за другом:** два Cover блока → нижний margin первого = Regular

Все изменения видны в реальном времени. Экспериментируйте с комбинациями — CSS не требуется.

## Материалы и источники

- [Dimensions: Padding, margin and block spacing (learn.wordpress.org)](https://learn.wordpress.org/lesson/dimensions-padding-margin-and-block-spacing/)

## Связанные страницы

- [Композиция макетов](https://wpcraft.ru/kb/stacks/wordpress/themes/practices/layout-composition.md)
- [Настройки темы](https://wpcraft.ru/kb/stacks/wordpress/themes/practices/theme-settings.md)
- [Медиа-блоки](https://wpcraft.ru/kb/stacks/wordpress/themes/practices/media-blocks.md)
- [UX-дизайн](https://wpcraft.ru/kb/design/ux.md)