Как наложить изображение поверх слоя?

Question

[Steel_Designer]

Нужно получить что то такое:

Я, с использованием bootsrap 4 сделал это:

<div class="container">
		<div class="row">
			<div class="col-5">
				<div class="row">
					<div class="col-9">91</div>
					<div class="col-3">31</div>
				</div>
			</div>
			<div class="col-2">
				<div class="fotorama" data-width="400" data-ratio="200/400" data-max-width="100%">
					<img src="img1/door.jpg" alt="Дверь" class="door" />
					<img src="img1/door.jpg" alt="Дверь" class="door" />
					<img src="img1/door.jpg" alt="Дверь" class="door" />
					<img src="img1/door.jpg" alt="Дверь" class="door" />
				</div>
			</div>
			<div class="col-5">
				<div class="row">
					<div class="col-3">32</div>
					<div class="col-9">92</div>
				</div>
			</div>
		</div>
	</div>

(fotorama - это просто слайдер)

Comments

[Kappy]

Поподробнее и желательно код залить куда то. Для перекрытия слоя используется z-index

[Макс]

Не совсем понятно с чем трудности? И какое изображение не получается наложить поверх блока, есть свойство css background. Если проблема в чем то другом, уточни проблему

Answer 1

[SpideR-KOSS]

Для нужного блока, который должен быть поверх остальных задать свойство CSS:

.block1 {
   z-index: 999;
}

И этим свойством можно делать различные наложения блоков, например:

.block1 {
   z-index: 1;
}
.block2 {
   z-index: 2;
}
.block3 {
   z-index: 3;
}

Соответственно block3 будет самый верхний, а block1 самый нижний, т.е чем выше значение z-index, тем выше блок.