Как отобразить блок за блоком (т.е. перекрытие)?

Если в админке блоки выглядят нормально, а на фронте один блок перекрывает другой, причина почти всегда в CSS: position:absolute, отрицательные margin, неправильный z-index, float без очистки или фиксированная высота родителя.

Первое, что нужно проверить в DevTools: какой именно элемент залезает на другой и почему. Посмотрите computed styles у проблемного блока: position, top/left, margin, transform, z-index, height, overflow.

Если блоки должны идти друг за другом, не используйте absolute-позиционирование для основной сетки. Должно быть примерно так:

.section {
  position: relative;
  margin-bottom: 40px;
}
 
.section + .section {
  margin-top: 40px;
}

Если внутри первого блока есть float-элементы, родитель может схлопнуться по высоте. Тогда следующий блок поднимается наверх. Исправление:

.parent::after {
  content: "";
  display: table;
  clear: both;
}

Или современнее — перейти на flex/grid вместо float.

Если проблема только в превью, а в редакторе всё хорошо, возможно, стили редактора и фронта отличаются. Gutenberg/конструктор может подгружать CSS в админке, но не подключать его на сайте. Проверьте, что нужный CSS подключается через wp_enqueue_scripts, а не только в админке.

Ещё частая причина — изображения без заданных размеров. Пока картинка грузится, родитель имеет меньшую высоту, а соседний блок “подъезжает”. Добавьте адаптивные размеры:

img {
  max-width: 100%;
  height: auto;
}

Если Вы используете конструктор, посмотрите настройки секции: negative margin, overlap, sticky, absolute, custom CSS. Обычно перекрытие включается именно там.

Без скриншота/HTML точнее сказать нельзя, но алгоритм такой: найти элемент в инспекторе, отключать подозрительные CSS-свойства по одному и закрепить исправление в child theme/custom CSS. Не правьте наугад весь шаблон — сначала найдите конкретное свойство, которое создаёт наложение.