Выровняйте фотографию по элементу div и сохраните отзывчивость ⇐ CSS

[Anonymous]

Я прошу вашей помощи, потому что у меня возникли трудности с помощью CSS, чтобы справиться с этой ситуацией. Моя цель — создать с помощью CSS что-то вроде этого. Вот ссылка https://ibb.co/gd5Rccw.


Я пытался реализовать на codepen, но мне трудно справиться с ответом.

Код: Выделить всё

.container {
border: 1px solid #DDDDDD;
background-color: #789456;
max-width: 1920px;
height: 600px;
position: relative;
margin:auto;
border-radius: 35px;
}

.tag {
float: left;
position: absolute;
left: 0px;
bottom: 0px;
z-index: 1000;
background-color: #92AD40;
padding: 5px;
color: #FFFFFF;
font-weight: bold;
}

h1 {
position:absolute;
right:0;
bottom:0;
}

Код: Выделить всё

[img]http://www.placehold.it/800x800[/img]
Title

Подробнее здесь: https://stackoverflow.com/questions/782 ... sponsivity