Как наложить блок на блок css

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

HTML:

<div class="outer-block">
  <div class="inner-block"></div>
</div>

CSS:

.outer-block {
  position: relative;
}

.inner-block {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  /* Добавим стили для внутреннего блока */
  width: 200px;
  height: 200px;
  background-color: #fff;
  border: 2px solid #000;
}

В данном примере внутренний блок (с классом «inner-block») налагается на внешний блок (с классом «outer-block») с помощью абсолютного позиционирования (по заданным координатам top и left). Для выравнивания внутреннего блока по центру мы используем свойство transform с функцией translate(-50%, -50%). Кроме того, мы задали для внутреннего блока задний план с помощью свойств z-index и background-color.