Каким образом сделать такое расположение картинок на css?

Каким образом сделать такое расположение картинок что-бы одна была наложенная на другую на css.Причем что-бы на мобильной версии смотрелось так же,а не расползалось.Ещё картинка 2 и 3 по ширине и по высоте меньше картинки 1.Сами картинки будут расположены в footer если имеет значение для ответа.

введите сюда описание изображения


Ответы (1 шт):

Автор решения: Leks

.a{
  background-color: green;
  width: 100px;
  height: 50px;
  margin: auto;
}
.b{
  background-color: red;
  z-index: 2;
  position: relative;
  top: -30px;
  left: 60px;
}
.c{
  background-color: blue;
  z-index: 3;
  position: relative;
  top: -60px;
  left: 40px;
  width: 250px;
  height: 100px;
}
<div class='a'>3</div>
<div class='a b'>2</div>
<div class='a c'>1</div>

→ Ссылка